JQuery验证器不适用于select输入

时间:2015-02-04 12:28:53

标签: javascript jquery select jquery-validate

<select name="child_class" class="drop-select-2">
    <option value="" >Choose...</option>
    <option value="1" >1</option>
    <option value="2" >2</option>
</select>

我有这个选择。我想在我的表单上使用jQuery验证器,而不允许选择“选择...”选项。我已经阅读了很多具有相同问题的stackoverflow问题,并且无处不在是值=“”使它成为现实。但在我的情况下,它不起作用,验证器根本不验证此输入。那是为什么?

在验证器规则中,我有:

rules: {
   child_class:       'required'
   ...
}

有什么问题?

3 个答案:

答案 0 :(得分:0)

这里运作正常 - &gt; Working FIDDLE

<form name="test" id="test">
<select name="child_class" class="drop-select-2">
    <option value="" >Choose...</option>
    <option value="1" >1</option>
    <option value="2" >2</option>
</select>
    <input type="submit"/>
</form>

// validate edit Category form when it is submitted
    jQuery("#test").validate({
        errorElement: 'div',
         errorClass:'errorjQuery',      
        rules: {

            'child_class': {
                required: true                  
            }                           
        },
        messages: {

            'child_class': {
                required: "Please choose 1 value.",
            }               
        },
        errorPlacement: function(error, element) {
            error.appendTo(  element.parent()  );
            $(".error-message").remove();           
        },

        submitHandler: function(form) {
            jQuery('input[type=submit]', form).attr('disabled', 'disabled');            
            idd = form.attr("id");          
            form.submit();          
        }
    }); 

答案 1 :(得分:0)

与@ jQuery.PHP.Magento.com的答案基本相同,它有效:

jQuery(window).ready(function() {
  jQuery('#your_form').validate({
    rules: {
      child_class:       'required'
    },
    submitHandler: function(form) {
      alert('k');
    }
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://cdn.jsdelivr.net/jquery.validation/1.13.1/jquery.validate.min.js"></script>

<form id="your_form">
  <select name="child_class" class="drop-select-2">
    <option value="" >Choose...</option>
    <option value="1" >1</option>
    <option value="2" >2</option>
  </select>
  
  <button type="submit">Send</button>
</form>

答案 2 :(得分:0)

您的代码与您提供的代码完全一致。

<强> HTML

<form id="myform">
    <select name="child_class" class="drop-select-2">
        <option value="">Choose...</option>
        <option value="1">1</option>
        <option value="2">2</option>
    </select>
    <input type="submit" />
</form>

<强>的jQuery

$(document).ready(function () {

    $("#myform").validate({
        rules: {
            child_class: 'required'
        }
    });

});

DEMO:http://jsfiddle.net/x21hnemb/