Question

It feels like this question has been asked before, but no questions seem to fix my issue, so apologies in advance.

Because I’m using ASP.NET and can’t predict the name of the controls I want to validate, I am setting up my jquery validate rules like so:

jQuery('textarea[id$=MessageTextInput]').rules("add", { required: true, messages: { required: "required"} });
jQuery('input[id$=LinkTextInput]').rules("add", { required: true, messages: { required: "required"} });
jQuery('input[name$=PositionChoiceInput]').rules("add", { required: true, messages: { required: "required"} });

Rather than:

$(‘#aspnetForm’).validate({options and rules}); // which requires the control names

The problem is, the third rule is a radiobuttonlist and the error message is not getting placed in the right place. It is getting placed directly after the first radiobutton, whereas I want it after the last radio button list.

jQuery('textarea[id$=MessageTextInput]').rules("add", { required: true, messages: { required: "required"} });
jQuery('input[id$=LinkTextInput]').rules("add", { required: true, messages: { required: "required"} });
jQuery('input[name$=PositionChoiceInput]').rules("add", { required: true, messages: { required: "required"} });

However, I cant seem to get the method to work when I add the errorPlacement option. I have also tried the following:

jQuery('#aspnetForm').validate({ errorPlacement: function (error, element) {
            if (element.hasClass('sfRadioList')) {
                error.insertAfter(element.parent("ul"));
            } 
        }
        });
jQuery('textarea[id$=MessageTextInput]').rules("add", { required: true, messages: { required: "required"} });
jQuery('input[id$=LinkTextInput]').rules("add", { required: true, messages: { required: "required"} });
jQuery('input[name$=PositionChoiceInput]').rules("add", { required: true, messages: { required: "required"} });

But that still hasnt worked. What can I do to set the placement of just one element?

Thanks in advance
higgsy

Answer 1

Here’s some code that worked for me…

errorPlacement: function(error, element) {
if (element.attr("name") == "pdfEmailAddress")
    {
        error.insertAfter("ul.slinks");
    }
    else
    {
        error.insertAfter(element);
    }
}