Placing all errors at beginning of a page

[Byron Raines]

Hi all. Getting back into ValidateThis. I have a form that is using
jQuery tabs. Since it is a tabbed form, I'd like to show all the
errors at the top of the page. When someone hits save, and the form
validates, depending on what tab is showing, you may not see errors on
other tabs. I see where I can change the defaults:


jQuery.validator.setDefaults({
errorClass: 'errorField',
errorElement: 'p',
errorPlacement: function(error, element) {
error.prependTo( element.parents('div.ctrlHolder') )
},


but not sure how to edit the errorPlacement attribute. Any
suggestions on how to accomplish this?

Thanks

Byron

[Bob Silverberg]

Hi Byron,

I've never done much monkeying around with the jQuery plugin. John is
our resident expert. John, do you have any suggestions for Byron?

Cheers,
Bob

> --
> You received this message because you are subscribed to the Google Groups "ValidateThis" group.
> To post to this group, send email to valida...@googlegroups.com.
> To unsubscribe from this group, send email to validatethis...@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/validatethis?hl=en.
>

--
Bob Silverberg
www.silverwareconsulting.com

[Matt Quackenbush]

Hey Byron,

This is something that has been on my "back burner" list for quite awhile now. I've not had any time to dig into it, but I think it will require a little bit of trickery - for lack of a better term. In a nutshell, there needs to be an error container of some sort, which is not present with cfUniForm unless server-side errors are returned AND placement is set to 'top' or 'both'. So, it will need to check for the existence of the container and insert the message if present; otherwise, create the container and insert the message.

So, the function in the `errorPlacement` setting would do that check/insert, rather than simply prepending the error to the parent `ctrlHolder` div.  Assuming markup similar to this....

<div id="errorMsg">
    <h3>Yo Chit Be Hozed!</h3>
    <p>Fix it now, homey!</p>
    <ul id="errorMsgList">
    </ul>
</div>

... you'd append an <li> with the message to #errorMsgList.

It's late and my brain cells are fried, but hopefully that will give you or John (or someone) a push in the right direction.

Whenever you/I/we/someone gets this figured out, this will go into cfUniForm, hopefully auto-detecting the presence of tabs and smartly switching the errorPlacement.

[Byron Raines]

Thanks, Matt. I think that's a good place to start. I'll see what I
can come up with.

Byron

> <bob.silverb...@gmail.com>wrote:

>
>
>
>
>
>
>
> > Hi Byron,
>
> > I've never done much monkeying around with the jQuery plugin. John is
> > our resident expert. John, do you have any suggestions for Byron?
>
> > Cheers,
> > Bob
>

> > On Mon, Jan 23, 2012 at 6:44 PM, Byron Raines <byron.rai...@gmail.com>

[John Whish]

Hi,
Sorry for the late input on this thread. I have done this in the past
before ValidateThis was born using the validate plugin. If I remember
correctly, then I just made all hidden form fields (the ones in the
hidden tabs) so that they were ignored by the validator.

$("#myform").validate({
ignore: ".ignore"
})

I did also have to make sure that if the tab was valid, then the
ignore class was removed from all fields and validation called again
so that the form would only submit if all fields passed.

I'll have to see if I can find the code as I'm saying this from what I
recall I did which may be a complete lie :)

[Martijn van der Woud]

Another option is to call the validate() method and provide an
errorplacement() function, which is called every time a field becomes
marked as invalid. You have full control over error placement from
there. Not sure about the exact name of the function, you can look it
up in the docs of the jquery validation plugin.

On 28 jan, 18:01, John Whish <john.wh...@googlemail.com> wrote:
> Hi,
> Sorry for the late input on this thread. I have done this in the past
> before ValidateThis was born using the validate plugin. If I remember
> correctly, then I just made all hidden form fields (the ones in the
> hidden tabs) so that they were ignored by the validator.
>
> $("#myform").validate({
>    ignore: ".ignore"
>
> })
>
> I did also have to make sure that if the tab was valid, then the
> ignore class was removed from all fields and validation called again
> so that the form would only submit if all fields passed.
>
> I'll have to see if I can find the code as I'm saying this from what I
> recall I did which may be a complete lie :)
>