2012-09-18 4 views
0

я иметь такую ​​форму:Как включить проверку поля выбора в эту функцию?

<form> 
<fieldset> 
<legend>Address Information</legend> 

<div> 
<label for="country">Country:</label> <span id="country-list"> 
<select name="country" class="required"> 
<option value="0">Please Select</option> 
<option value="1">Afghanistan</option> 
<option value="2">Albania</option> 
<option value="3">Algeria</option> 
<option value="4">American Samoa</option> 
</select>&nbsp;</span> 
<span class="error_msg" style="display: none; "> 
<br><label for="space">&nbsp;</label>Please select your country.</span> 
</div> 

<div> 
<label for="street-address">Street Address:</label> <input type="text" id="street_address" name="street_address" value="" size="50" class="required"> 
<span class="error_msg" style="display: inline; "><br><label for="space">&nbsp;</label>Please enter your accurate street address (at least 7 characters)</span> 
</div> 

<div> 
<label for="suburb">Suburb:</label> <input type="text" name="suburb" value="" class="required"> 
</div> 

<div> 
<label for="city">City:</label> <input type="text" id="city" name="city" value="" class="required"> 
<span class="error_msg" style="display: inline; "><br><label for="space">&nbsp;</label>Please enter your city (at least 4 characters)</span> 
</div> 

<div> 
<label for="post-code">Post Code:</label> <input type="text" id="postcode" name="postcode" value="" class="required"> 
<span class="error_msg" style="display: inline; "><br><label for="space">&nbsp;</label>Please enter your postal code (at least 3 characters)</span> 
</div> 

</fieldset> 
</form> 

У меня есть функция JQuery ниже, что при щелчке представить, он проверяет только input text fields, но не поле выбора. Он вернет либо true, если поля имеют значения и false, если есть поле, которое не имеет значения.

function ValidateForm() 
{ 
    jQuery('span.error_msg').hide(); 
    var success = true; 

    jQuery("#shippingF .required").each(function() 
     { 
      if(jQuery(this).val().length <= 2) 
      { 
       jQuery(this).next().show(); 
       success = false; 
      } 
    }); 

    return success; 
} 

Как включить поле выбора в эту простую функцию проверки?

ответ

0

ОК, извините меня отбросило на некоторые ошибки в исходном коде, вот окончательный рабочий вариант

function ValidateForm() 
{ 
jQuery('span.error_msg').hide(); 
var success = true; 

if($('select[name=country]').val() == '0'){ 
    success = false; 
    } 
    jQuery(".required").each(function() 
     { 
     if(jQuery(this).val().length <= 2) 
     {alert(jQuery(this).val().length); 
      jQuery(this).next().show(); 
      success = false; 
     } 
}); 

return success; 
} 

Несколько примечаний на исходном коде:

  1. не удалось найдите идентификатор выбора shippingF, поэтому мне пришлось удалить его и ссылку по классу .required, если вы определите, что где-то в иерархии, тогда это должно быть хорошо

  2. удалил класс .required из элемента select, чтобы он не включался в ваш цикл. Это всегда будет возвращать 1 и привести к ошибке вашего оператора if(jQuery(this).val().length <= 2) .

Вот working fiddle

+0

Это просто проверит сначала поле выбора. Как если поле выбора имеет значение «0», а остальные поля пустые? то вместо сообщения об ошибках для каждого пустого поля ввода будет отображаться только сообщение об ошибке в поле выбора. – Ken

+0

Проверьте обновленное решение – hsalama

0

Вы можете включить другую оценку в петлю и проверить, если его выбрать:

function ValidateForm() 
{ 

    jQuery('span.error_msg').hide(); 
    var success = true; 

    jQuery("#shippingF .required").each(function() 
    { 

     if(jQuery(this).hasClass('select')) { 
      if(jQuery(this).val() == 0) { 
      success = false; 
      } 
     } else { 
      if(jQuery(this).val().length <= 2) { 
      jQuery(this).next().show(); 
      success = false; 
      } 
     } 
    }); 
    return success; 
} 

Что-то вдоль этих линий.

+0

Не работает сэр. Проверяются только поля ввода. – Ken

Смежные вопросы