无法使用[]验证复选框

时间:2016-03-12 10:03:31

标签: jquery html css validation

好吧,如果我把复选框空间字段没有[]但是如果我喜欢这个

,以下代码可以正常工作
$(function() {

// Setup form validation on the #register-form element
$("#reservation").validate({

    // Specify the validation rules
    rules: {
        room[]: "required",
        start: "required",
        end: "required",
        name: "required",
        phone: "required",
        email: {
            required: true,
            email: true
        },
        address: "required"
    },

    // Specify the validation error messages
    messages: {
        room[]: "    Select one room",
        start: "Select Check In date in Room Availability",
        end: "Select Check Out date in Room Availability",
        name: "Enter your full name",
        phone: "Phone number is required",
        email: "Please enter a valid email address",
        address: "Address is required"
    },


    submitHandler: function(form) {
        form.submit();
    }
});

});

然后带有房间[]的房间字段没有任何错误来选择一个房间。

1 个答案:

答案 0 :(得分:-1)

http://jqueryvalidation.org/files/demo/radio-checkbox-select-demo.html

使用工作示例进行更新:

http://codepen.io/anon/pen/RaGbeP

$(function() {
$('#myform').validate({
rules: {
  "room[]": {
    required: true
  }
},
messages: {
  "room[]": {
    required: "Please select a room<br/>"
  }
},
errorPlacement: function(error, element) {
  if (element.is(":radio")) {
    error.appendTo(element.parents('.container'));
  } else { // This is the default behavior 
    error.insertAfter(element);
  }
}
});

});

<form id="myform">
  <label for='room'>Select one room:</label>
  <p class='container'>
  <label><input type='checkbox' name='room[]' value='room one' />one</label>
  <label><input type='checkbox' name='room[]' value='room two' />two</label>
  <label><input type='checkbox' name='room[]' value='room three' />three</label>
</p>
<input type="submit" name="submit" value="Submit">
</form>