Home/ Questions/Q 8848405
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-14T12:24:57+00:00

I’m using the jQuery validate plugin for my form validation. I’ve got it working

  • 0

I’m using the jQuery validate plugin for my form validation. I’ve got it working fine when setting mandatory fields (using rules and messages), and they get highlighted if they’re not completed when the user tries to submit the form.

I have another requirement though, and I wonder if this can be done with the jQuery validate plugin or not?

I have a dropdown field with three values – Draft, For Review, and Published. The default value is Draft. I want a popup alert box to instantly appear when the user changes the dropdown value to Published which says, “Are you sure you want to this to be published?” With options of Okay or Cancel.

Is this possible with the jQuery validate plugin? If so, how?

Thanks for any help,

Ste

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I wouldn’t do an interactive cofirmation in a jquery validate rule, although if you really want to it is possible. One reason why not is that the rule will run when you submit the form, as part of the form validation, giving you a second confirmation popup.

    try it and see if it works for you

    <html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.10.0/jquery.validate.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $.validator.addMethod("myConfirm", function (value) {
            confirm('are you sure?');
            return true;
        }, '');

        $(function () {
            $('form').validate({
                onfocusout: false,
                // warning - I don't recommend doing this
                rules: { mychoice: "myConfirm" }
            });
            $('select').change(function () {
                $('form').validate().form();
            });

        });
</script>
</head>
<body>
    <form>
    <select name="mychoice">
        <option>great</option>
        <option>good</option>
    </select>
    <input type="submit" />
    </form>
</body>
</html>
    • 0