Being more of a "designer" than a coder, I'm having trouble with
this. I've not been able to find any examples of errorPlacement or
showErrors that seem to apply in this situation. I don't understand
what you mean by adding a different class to the actual label -- would
I still be able to use highlight and unhighlight, or is that my
problem? I apologize for my ignorance. Thanks for your help so far,
I'll keep researching and experimenting...
LVR
On Jun 30, 11:09 am, "Jörn Zaefferer" <[EMAIL PROTECTED]>
wrote:
> Don't add the error class to thelabel. The validation plugin searches
> for the errorlabelbased on that error class - adding it to the
> actuallabelcauses thelabelto disappear.
>
> You could add a different class to the actuallabelso that the errorlabelcan
> be hidden or removed entirely (via errorPlacement, or
> showErrors).
>
> Jörn
>
> On Mon, Jun 30, 2008 at 6:35 PM, LVR <[EMAIL PROTECTED]> wrote:
>
> > I'm having a consistent problem with labels disappearing on keyup
> > using theValidateplug-in. All of the functionality of thevalidate
> > plug-in is there -- it works great. But elements are jumping around
> > on the page!
>
> > When a field is invalid, the "labelfor" tag turns thelabelred and
> > bold. So far, so good. When the info becomes valid as it's entered,
> > the wholelabeldisappears. I think style="display:none;" is being
> > applied to thelabel. In my case, the css I use causes the form field
> > to jump to the left, taking the place of thelabel. Subsequent key-up
> > strokes (if they are used/needed) cause thelabelelement to re-appear
> > and the form field to jump back into place.
>
> > I'm using the most current versions of jQuery and theValidateplug-
> > in. I'm using XHTML Strict. This behavior occurs on all platforms
> > and browsers I've tested. Thanks in advance for any help...
>
> > Here's my code:
>
> > <script type="text/javascript">
> > $(document).ready(function(){
> > $("#register").validate({
> > highlight: function(element, errorClass) {
> > $(element).addClass(errorClass);
> > $(element.form).find("label[for=" + element.id
> > +"]").addClass(errorClass);
> > },
> > unhighlight: function(element, errorClass) {
> > $(element).removeClass(errorClass);
> > $(element.form).find("label[for=" + element.id
> > +"]").removeClass(errorClass);
> > }
> > });
> > });
> > </script>
>
> > Typical form elements:
>
> > <labelfor="first"><span class="rqd">•</span>First Name:</label>
> > <input name="first" id="first" size="25" maxlength="50"
> > class="required" value="" /><br />
> > <labelfor="last"><span class="rqd">•</span>Last Name:</label>
> > <input name="last" id="last" size="25" maxlength="50"
> > class="required" value="" /><br />
>
> > Thanks...
> > LVR
