views:

39

answers:

1

Hi,

I am trying to use jquery validate plugin on my 5 questions quiz form. But I have issue with how to display the validated error message for require field.

My form is something like this:

<form id="quiz">
<table width="100%">
<tbody>
<tr id="qntr">
    <td id="qntd">My question 1</td>
    <!-- if field is empty, validate error message to appear over here -->
</tr>
<tr id="anstr">
    <td id="anstd">
    <table><tr>
        <td>Choice 1</td>
        <td>Choice 2</td>
        <td>Choice 3</td>
    </tr></table>
    </td>
</tr>
<tr id="qntr">
    <td id="qntd">My question 2</td>
    <!-- if field is empty, validate error message to appear over here -->
</tr>
<tr id="anstr">
    <td id="anstd">
    <table><tr>
        <td>Choice 1</td>
        <td>Choice 2</td>
        <td>Choice 3</td>
    </tr></table>
    </td>
</tr>
...
</tbody>
</table>
</form>

My validate.js:

$(document).ready(function() {
        var form = $("#quiz");
        form.validate({

            errorPlacement: function(error, element) {
                 error.insertAfter(x);  // what should x be?
            }

        });

});

I would like to what should be used to replace 'x' in the errorPlacement for my validate error message to show up in the of my form?

Thank you.

A: 

UPDATE

Here is my updated solution:

error.appendTo(element.parents('#anstr').prev('tr'));

ORIGINAL POST

Did you try?

error.insertAfter(element);
dejavu
hi dejavu, I tried to use error.insertAfter(element), but it will appear within the Choice 1 radio button, instead of my desire location.
jl
I have updated my post .. check my new answer.
dejavu
thanks, it works!
jl
glad that I could help :)
dejavu