Usability after failed validation

After submitting a form, the page reloads, but if it’s a long page and the form is at the end of the page, in case of a failed validation, to see the message the user may have to scroll down, thus not getting the form wasn’t sent.

One solution would be to jump to an anchor of the form or the validation message after the reload - is this possible?

Would this do it?

<form ... action="myPage.html#jumphere">

Bob

Wow Bob, you’re smart! It’s doing it! Thanks!

You could also place the validation message at the top of the page. Just place the [+validationmessage+] placeholder in your document or template. This is the one placeholder that you can set outside the form template. (do remember to remove it from the form template in that case though)

<form ... action="myPage.html#jumphere">

Thanks, this resolves an issue for me to. Although I don’t like forms at the end of long pages in general, sometimes they are inevitable.

Quote from: nightsignals at Nov 21, 2007, 09:38 PM

Wow Bob, you’re smart! It’s doing it! Thanks!

<form method="post" action="[~[*id*]~]#form">

You’re welcome. Here’s the funny part, I needed the same thing but had been too lazy to look for an answer until I saw your question.

Bob

Quote from: TobyL at Nov 22, 2007, 12:50 AM

You could also place the validation message at the top of the page. Just place the [+validationmessage+] placeholder in your document or template. This is the one placeholder that you can set outside the form template. (do remember to remove it from the form template in that case though)

Where do I define [+validationmessage+]?

I am still new to MODx and don’t fully understand this placeholder concept..

Quote from: DarkStar at Nov 22, 2007, 12:02 PM

Where do I define [+validationmessage+]?

I am still new to MODx and don’t fully understand this placeholder concept..

The validationmessage is relying on the strings in the language file of eForm, and cobined with what you define in the pseudo attribute "eform" for the form fields:

Datatypes and formatting

eForm is incorporating a form parser which extracts formatting and validation options from each form field. To set options for a field add the eform (pseudo) attribute to each required form field.

<input type="text" name="color" eform="A Color:string:1" />

The basic format of the eform attribute is:

[description/title]:[datatype]:[required]:[validation message]:[validation rule]

(taken from the eForm documentation in the doc folder of the snippet)

So if that example field is not passing validation (because it’s left empty) you will get a message telling you that required fields are missing (from a string in the language file you defined for eForm), and it will tell you it’s the field "A Color", as defined in the eform pseudo attribute in the form itself.

This information then is returned by the placeholder [+validationmessage+]