Как проверить радио и массив перед отправкой формы?

Question

Мне нужно подтвердить две вещи на этой форме: 1. Есть два переключателя: • ОПЦИЯ 1 - Функция щелчка скрывает поля мм/дд/гггг для ОПЦИИ 2 • ОПЦИЯ 2 - Функция щелчка показывает мм/dd/yyyy, которые не требуются. 2. Поле почтового индекса. Необходимо проверить массив допустимых почтовых индексов.

У меня эта форма БОЛЬШОЙ, работая в стороне от нескольких проблем: 1. Если вы нажмете кнопку «Отправить», не проверяя или не заполняя что-либо, он заменяет часть текста на странице словом «Недопустимый» и наоборот, когда действительная информация была заполнена. 2. Она не переходит на следующую страницу, если действительная информация была отправлена. 3. Он только проверяет поле zipcode и не требует переключателей.

Любая помощь была бы принята с благодарностью! Благодаря!

Тестовая страница здесь: http://circleatseven.com/testing/jquery/zipcodevalidation/

Answer 1

Если у меня есть вы понимаете, вы ищете это:

Я не имею написать сообщение с «недействителен», я дать предупреждение.

В вашем HTML добавить "onsubmit" в форму-Tag:

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

и добавить Submit-кнопки в форму или триггером на вашем псевдо-Submit-кнопки .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;} 
     } 

Answer 2

Друг помог мне .. Мы закончили с помощью 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>