0

I am using jQuery validation plugin to validate form elements.By default,calling validator's form method, It won't show error message if the element is valid(of course this is right),But, when I set the element invalid,the error message won't show neither.Below is my code.

<script>
$(function () {
    $("form").validate({
        rules: {
            sex: {
                required: true
            },
            age: {
                required: true
            }
        },
        messages: {
            sex: {
                required:"Please Chose Your Sex"
            },
            age: {
                required:"Please Fill Your Age"
            }
        }
    });
    $("[name=btn]").on("click", function () {
        $("form").validate().form();
    });
});

<form>
<div>
    Sex:
    <select name="sex">
        <option value="">Chose Your Sex</option>
        <option value="1" selected="selected">Male</option>
        <option value="2">Female</option>
    </select>
</div>
<div>
    Age:
    <input name="age" />
</div>
<input name="btn" value="save" type="button" />

Step1: Click the button,sex element is valid,age element is invalid,it will be display age error message.

Step2: Fill out the age,error message will be disappear.

Step3: Select the sex to the first item(Chose Your Sex),I wish it could display the sex error message,but it will be display until the button was clicked again.

Hopefully somebody can help me!

Qiang
  • 1
  • 2
  • 1
    Add an example of your html structure and js code to the question please – LS_ Jul 19 '18 at 09:32
  • 1
    how do you set your element invalid and why you want to do that? – Christopher Supertramp Jul 19 '18 at 09:38
  • Entire premise of your question makes little sense. If the element is already valid then there is nothing to force. Otherwise, if you don't get validation when the field contains invalid data, then obviously you're doing something wrong. Since you have not shown us any code whatsoever, how exactly are we supposed to know how to help you? I suggest you read the FAQ, which explains how to properly ask a question here. As already stated, you need to show us the relevant code and more clearly explain how to reproduce the issue. – Sparky Jul 19 '18 at 14:21
  • @Signo please re-look again,thanks – Qiang Jul 20 '18 at 02:06
  • @ Christopher Supertramp please re-look again,thanks – Qiang Jul 20 '18 at 02:06
  • It's because you already have an `option` selected by default when the form is validated. `selected="selected"` That's just how the plugin works. If you think it's a bug, then you should complain to the developer on his GitHub page. Otherwise, there is nothing for us to help you with since you're using the plugin correctly. – Sparky Jul 20 '18 at 03:32
  • A workaround would be to trigger the `.valid()` method inside of a `change` handler on your `select` element. DEMO: https://jsfiddle.net/cLvhjw7s/ – Sparky Jul 20 '18 at 03:34
  • FYI - It should be *"Please **choose** your sex"*, not *"chose"*. – Sparky Jul 20 '18 at 03:35
  • thanks,Watching change event works for me @Sparky – Qiang Jul 20 '18 at 04:25

0 Answers0