Alfred
Alfred

Reputation: 21396

Jquery-validate custom success messages


I am using jquery validate plugin.
It is a modified bassistance form.
I am having a syntax as below.

var validator = $("#myform").validate({
        rules: {
            field1: {
                required: true,
                remote: {
        url: "field1.php",
        type: "post",
          },
            },
            field2: {
                required: true,
                remote: {
        url: "field2.php",
        type: "post",
          },
            },
            Date: {
                required: true,
            },
        },
        messages: {
            field1: "Specify field1",
            field2: "Specify field2",
            Date: {
              required: "Specify Date",
            },
        },
        errorPlacement: function(error, element) {
                 error.appendTo($('#errorbox'));
                 },
        success: function(label) {
            label.html("OK").addClass("checked");
        }
    });

Here i have the option to display different custom error messages. But How can i display different custom success messages??

Thanks in advance.. :)

blasteralfred

Upvotes: 2

Views: 4651

Answers (1)

Jessica Brown
Jessica Brown

Reputation: 8312

One simple, but perhaps not so clever way, would be that you could modify your success function above to contain conditional logic to select what the contents of label.html() should be.

Here is an example:

success: function(label) {
    // if input validated is "#username" do something special
    if (label.attr('for') == "username") { 
        // add a label next to the field saying username is available and assign css class "checked" to this label
        label.html("username available").addClass("checked");
        // add css class to change background color for the input box to have a green border (presumes you have input.valid defined in your css file)
        var element = '#' + label.attr('for');
        $(element).addClass('valid');
    } else {
        // For other valid input boxes just add generic label like "OK!"
        label.html("OK!").addClass("checked");
    }
},

Upvotes: 2

Related Questions