[ale] javascript question

[Michael B. Trausch]

On Fri, 7 Aug 2009, Geoffrey wrote:

> I'm trying to find a short cut way to do something in javascript.
>
> Got a page full of fields.  User finishes inputing data, and submits.
> The data produces an error and therefore I need to refresh the page and
> let them fix the data.
>
> This data is validated in a database, so I can't simply check the data
> before submission.
>
> We were trying:
>
> window.location.reload(history.go(-1))
>
> But that refreshes the page as well as attempts to resubmit with the
> invalid data.

Yes, this will resubmit any form data as part of the action, so it's not 
something that you can likely adapt for use.  Instead, you'll need to 
generate the same page, but you can return it with something to unhide 
hidden fields in JavaScript (if you must use JavaScript at all).

For example, the page on initial load spits out lots of forms, which may 
look like (using square brakets to avoid issues):

  [label for="fname"]First Name[/label]
  [input name="fname" id="fname" type="text" /]
  [span class="error no_display"]You must enter a first name.[/span]

Now, when you send the page back and there are errors, you could add
a hidden input named "fname_error", set to true.  JavaScript could then 
traverse the DOM when you get the new page back, and un-set no_display on 
all of the fields that have errors.

The no_display in CSS would be nothing more complex than:

.no_display {
     display: none;
}

And when that class is removed from a target element, it would display 
normally.

> Suggestions?  I'm trying to not rebuild the page by hand with the
> pre-populated fields, but that might be what I have to do.

You may; typically, a non-AJAXified form goes through:

Begin:
  * Prompt user for data.
  * User submits data.
    * If there are errors, re-generate page with errors and valid data
    * If there are errors, goto Begin:
  * Data is input into storage back-end.

Note, though, that you should still retain that since JavaScript is run on 
the client-side, and users can muck with it.  You do not want to trust 
AJAX validation even when the application contains a hard requirement on 
JavaScript.

Still, you should have a way to "hook" into server-side validation and 
carry it through to the front end, and your form generator on the server 
side should be able to handle errors and generate the form correctly for 
the cases where (a) the user is viewing it for (for the purposes of entry) 
the first time, and (b) the user is viewing it with error responses. 
Nearly any server-side scripting language or programming language makes 
this somewhat trivial.

 	--- Mike