2011-02-02 98 views
0

我需要驗證這種形式的兩件事情: 1,有兩個單選按鈕: •OPTION 1 - 在用戶點擊函數隱藏用於OPTION毫米/日/年字段2 •OPTION 2 - 在用戶點擊功能顯示毫米/ dd/yyyy不需要的字段。 2.郵政編碼字段 - 需要驗證可接受郵政編碼的數組。如何在提交表單之前驗證廣播和數組?

我已經得到了這個表單大部分都是從一些問題開始工作的: 1.如果你點擊提交而沒有檢查或填寫任何內容,它會將頁面上的一些文本替換爲單詞「無效」,反之亦然有效信息已填寫。 2.如果已提交有效信息,則不會進入下一頁。 3.它只驗證郵政編碼字段,不需要單選按鈕。

任何幫助將不勝感激!謝謝!

測試頁面在這裏:http://circleatseven.com/testing/jquery/zipcodevalidation/

回答

0

如果我中有你明白你搜索這個:

我沒有寫有「無效」消息,我舉一個警報。

在你的HTML添加「的onsubmit」你的表單標籤:

<form method="post" action="success.php" id="step1" onsubmit="checkdata();"> 

,並添加一個提交按鈕到窗體或觸發你的僞提交按鈕.submit()使用jQuery。

在你的JavaScript您添加以下功能:

function checkdata() { 
      if ($(":radio:checked").length < 1) { 
       alert('Please choose an Option!'); 
       return false; 
      } 
      zipCodeOk = false; 
      zipCodes = new Array(75001, 75002, 75006); //Your Zip-Codes 
      for (var i = 0; i <= zipCodes.length; i++) { 
       if ($('#enterZip').val() == zipCodes[i]) { 
        zipCodeOk = true; 
        break; 
       } 
      } 
      if (!zipCodeOk) {alert('Please enter a valid Zip-Code!');return false;} 
     } 
0

朋友幫我..我們結束了使用jQuery驗證插件 - 這裏就是我們想出了:

<script type="text/javascript"> 
    $(document).ready(function(){ 

     jQuery.validator.addMethod("validZip", function(value) { 
      var zips=['12345', '23456', '34567', '45678', '56789', '67890', '78901', '89012', '90123', '']; 
      if ($.inArray(value,zips) > -1) { 
       return true; 
      } else { 
       return false; 
      } 

     }, "invalid zip"); 

     $("#step1").validate({ 
      rules: { 
       currentServiceStatus: "required", 
       enterZip: { validZip : true } 
      } 
     }); 

     $('.moveInDates').hide(); 
     $(":radio:eq(0)").click(function(){ 
      $('.moveInDates').hide(); 
     }); 
     $(":radio:eq(1)").click(function(){ 
      $('.moveInDates').show(); 
     }); 

    }); 
</script> 

而且這裏的HTML:

<form method="post" action="success.php" id="step1"> 

<h1>CHOOSE *</h1> 
<input name="currentServiceStatus" type="radio" value="Switch Me" /> OPTION 1 
<br/> 
<input name="currentServiceStatus" type="radio" value="Move-In" /> OPTION 2 (reveals more fields on click) 

<div id="dateInputs" class="moveInDates"> 
    <h2>Move-In Date (not required)</h2> 
    <p><span class="mmddyyyy"><input name="moveInDateMonth" type="text" class="text" id="moveInDateMonth" />/<input name="moveInDateDay" type="text" class="text" id="moveInDateDay" />/<input name="moveInDateYear" type="text" class="text" id="moveInDateYear" /></span> 
</div> 

<hr/> 

<h1>ZIP CODE *</h1> 
<p>Enter one of the following acceptable Zip Codes:</p> 
<p>12345, 23456, 34567, 45678, 56789, 67890, 78901, 89012, 90123,</p> 

<input name="enterZip" type="text" class="text" id="enterZip" /> 

<hr/> 

<input type="image" id="submitButton" src="http://circleatseven.com/testing/jquery/zipcodevalidation/library/images/btn_submit.jpg" /> 
<p><em>* Required</em></p> 

</ul> 

相關問題