[jQuery] [validator] Display error messages in a convenient location per each

[jQuery] [validator] Display error messages in a convenient location per each


Hello,
I'm playing with the great Bassistance jQuery Validator and am stuck
at a point
The idea is simple: I have lot of this markup (I semplify, but the
idea is that after each <input> there could be something else, i.e. a
word, an icon, etc... that is "inline" with the corresponding<input>):
<ol>
<li><input type="text" id="width" size="3"></input> px</li>
<li><input type="text" id="height" size="3"></input> px</li>
<li><input type="text" id="thumb" size="3"></input> px</li>
</ol>
Well, the Validator "forces" the error messages to appear just after
the <input>, so I get something like:
[input] "insert a number here" px
[input] "insert a number here" px
[input] "insert a number here" px
In other words, the error messages "split" the natural flow of the
line
The best would be to put the error message on a line after the <input>
+following element, so:
[input] px
"insert a number here"
[input] px
"insert a number here"
[input] px
"insert a number here"
But there's no way to reach this
Wrapping the <input> and the following element in a <div> has no
effect, since the error message alway go after the <input> and not
after the wrapper div
The error container demo (http://jquery.bassistance.de/validate/demo/
errorcontainer-demo.html) does not match my needs since it wraps ALL
errors in a single div - but the idea of showing the error NOT close
to the <input> is nice
Please, can you help? Is there a solution for this?
Thanks