Rail3: UJS submit after client-side validation

rubyonrails-talk
1

I am have some problems with UJS. I have a (potentially) large form that I was doing client side validation on (yes there is also some server side validation) using an old prototype validation routine that is not working with the current version.

I actually got validation to work by coping and modifying some of the rail.js routine to observer submit. I also had some javascript toggles that I got to work.

I then found a post on behaviors:

http://weblog.jamisbuck.org/2010/3/2/unobtrusive-yet-explicit

This method worked great for my toggles, but then I tried to create one for the submit button. While it did the validation, It would always submit.

I then changed the input type to button and the validation would work, but I could not get the form to submit.

Debugging all seemed to work (names, classes, etc)

Behaviors.add("click", "validate", function(element) {   var formElements = $$(".required", ".required-one");   var valid = true;   var thisform = element.form   ... validations stuff

but when I got to the end   if(valid){thisform.submit()}

would fail saying the input element does not have a function submit. thisform is reported as and htmlformelement.

I know this may be a little off target but I bet I am not the only one using client-side validation.

If someone can point me in the right direction, I'll go learn some more.

Steve

2

...

Debugging all seemed to work (names, classes, etc)

Behaviors.add("click", "validate", function(element) { var formElements = $$(".required", ".required-one"); var valid = true; var thisform = element.form ... validations stuff

but when I got to the end if(valid){thisform.submit()}

would fail saying the input element does not have a function submit. thisform is reported as and htmlformelement.

...

This must have been one of those posts where nobody knew what I was talking about. That just spawns another learning exercise.

My problem was I didn't understand Javascript as much as I should to even ask the question. At least I didn't know about anonymous functions.

I solved my problem when I figured out how those functions work, and more importantly, what arguments are passed to them.

Just in case anyone wants to know about Unobtrusive Javascript on the client side, I posted a gist <http://gist.github.com/525561&gt; that outlines my learning experience and how I got it to work.

The sort version is, all that I needed was:    if(!valid){event.stop()}

To stop the onsubmit event from propagating. I didn't know I had "event" available in my Behaviors.add function.

Steve