jQuery验证-显示每个字段的错误消息

Question

http://jsfiddle.net/nXqd/qC2Ya/6/

Take a look at the jsfiddle. When I enter wrong data in two inputs and clicking submit, I only receive the error message on the first one. Now I want two of them which have the name attribute in the form displayed as well.

In this example, I use the same name on purpose to get these values on the backend easier. I just loop through the list and get all information.

Answer 1

You are doing it wrong. You have added same name for both fields. Same name attributes are used to combine the fields in a group. You have to use class based validation.

Answer 2

working demo http://jsfiddle.net/xr5g6/1/

Hope it fits your needs. :)

code

$("form").validate({
    rules: {
        number: {required: true, range: [1,2]},
        number2: {required: true, range: [1,2]}
    }
});

​html

<form name="myForm">
<fieldset>
<legend>My Form</legend>
    <label for='number'>Number</label>
    <input name='number'class='required'/> <br />
    <label for='number'>Number</label>
    <input name='number2' class='required'/>
    <label for='change-range'>Max range</label>
    <input name='change-range' class='required'/>
</fieldset>
<input type="submit">
</form>
​

Answer 3

You should use different name attriburtes for different inputs.

Demo: http://jsfiddle.net/xYTNw/