CODEWITHSUNDEEP
jqueryjquery-validate
Jess McKenzie
Jess McKenzie

Reputation: 8385

jQuery Setting a validation error box with two classes

I have an with my code and I have one particular textarea that I am using the main .error class and another .textAreaError that places the error box were I want it but I am unsure how I would configure the textarea error to load in this specific box.

From a previous question I was given the following jQuery line function(error, element) { error.appendTo(element.siblings("label")); } but I am unsure how to work it into the code below.

jQuery:

jQuery(document).ready(function() { 
    //Home Validation
    onfocusout: true,
    $("#quote").validate({
        rules:{
            companyName:{
                required: true,
                url: true
            }
        }
    });

HTML:

<div class="error textAreaError">Error Here</div>

Upvotes: 0

Views: 300

Answers (1)

Trax72
Trax72

Reputation: 958

From looking at the documentation for the validate plugin, it looks like you can control the position of the error with the errorPlacement argument which uses function(error, element). The code would look something like this:

jQuery(document).ready(function() { 
    //Home Validation
    $("#quote").validate({
        onfocusout: true,
        rules:{
            companyName:{
                required: true,
                url: true
            }
        },
        errorPlacement: function(error, element) {
            if (element.is("textarea"))
                error.appendTo(".textAreaError");
            else
                error.appendTo(".generalError");
        }
    });
});

You'd have to give the general error box the generalError class. Or, give the error boxes id's and refer to those instead (e.g. "#textAreaError" and "#generalError").

Upvotes: 1

Related Questions