Form submit bubble

[kstubs]

Does a form submit bubble up to the containing element?

I'd like to capture form submit on a container div for a form submit.  Reason being:  I create the form on the fly based on whichever child element the user has selected (if any).  I'd like to add a form submit handler to the container, much like I do for click events, to handle and setup the form submission one time.

Karl..

[Walter Lee Davis]

On Sep 26, 2012, at 5:00 AM, kstubs wrote:

> Does a form submit bubble up to the containing element?
> I'd like to capture form submit on a container div for a form submit. Reason being: I create the form on the fly based on whichever child element the user has selected (if any). I'd like to add a form submit handler to the container, much like I do for click events, to handle and setup the form submission one time.

I'm not sure if it does in every browser. You may be able to simulate this with synthetic events, using fire() on the form to send out the broadcast, and observe() on the DIV to receive.

Walter

[Jason Westbrook]

my suggestion is to setup a function as the event handler and on form creation add the submit observe - also if you are worried about memory leaks remove all the child elements of the container on new form creation

ie

function handle_submit( event) {

// handle submit action

}

$("container").childElements().invoke("remove");

var form = new Element("form");

form.observe("submit",handle_submit);

// add more elements to the form

$("container").update(form);

Jason Westbrook | T: 313-799-3770 | jwest...@gmail.com

--
You received this message because you are subscribed to the Google Groups "Prototype & script.aculo.us" group.

To post to this group, send email to prototype-s...@googlegroups.com.
To unsubscribe from this group, send email to prototype-scripta...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.

[kstubs]

OK, I understand what needs to be done, I just need to bind the form submit each time it is created and then destroy it, the form and the handler.

Thanks,

Karl..

To unsubscribe from this group, send email to prototype-scriptaculous+unsub...@googlegroups.com.

[kstubs]

OK, I have something like this:

this.zz__handleCommentFormSubmit = this.comment_form.on('submit', this.__handleCommentFormSubmit);

It is unclear to me, reading from the API, if I must bind or bindAsEventListener or leave it as it, the method: this.__handleCommentFormSubmit, in the above statement.

Karl..

FYI.. "this" refers to my class.

[Jason Westbrook]

my interpretation of the documentation is as follows

if that is inside a class then you might have to use bind to make sure that "this" still refers to your class instance - vs "this" would refer to the element the event was fired on

Jason Westbrook | T: 313-799-3770 | jwest...@gmail.com

To view this discussion on the web visit https://groups.google.com/d/msg/prototype-scriptaculous/-/zJ7lmI3W-5UJ.

To post to this group, send email to prototype-s...@googlegroups.com.

To unsubscribe from this group, send email to prototype-scripta...@googlegroups.com.

[kstubs]

Yes, I'm just wondering if the clever .on method elminiates this, and perhaps it does not.  I am finding that if I want to intercept the Submit event, then I have to bindAsEventListener so that I can actually trap the submit event and stop it (then do my own thing with the form and submit to my own custom (Ajax) script.

Karl..

To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com.

For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.

[Jason Westbrook]

if you want to stop the event try this - even works with observe / on methods

function handle_submit( event )

{

event.stop();

//all other code

}

$("formid").observe("submit",handle_submit);

Jason Westbrook | T: 313-799-3770 | jwest...@gmail.com

To view this discussion on the web visit https://groups.google.com/d/msg/prototype-scriptaculous/-/BO6tcIh9qLQJ.

To post to this group, send email to prototype-s...@googlegroups.com.

To unsubscribe from this group, send email to prototype-scripta...@googlegroups.com.

[Victor]

In some browsers it doesn't bubble. Attached file at the end has submit and change bubbling emulation (that is file from working system, so I've not stripped anything). Now you can observe submit with document.on("submit", function(event, form) {}) in any browser (works in production in IE6-9, Firefox, Chrome, Opera, Safari).

[Victor]

P.S. Inspired by RoR user.js and Kangax.