Forum: Rails Spinoffs (closed, excessive spam) submit button with an onclick attribute set doesn't work in opera

I have the following code inside a form that submits via XHR:

<button id="finalize_button" type="submit"
onclick="finalizing();">Finalize Order</button>

finalizing() basically changes the button text and disables the button
while the form is submitting. Works as expected in FF, but in Opera
9.5, the button gets disabled but the form fails to submit. If I
remove the onclick attribute it works fine. Any suggestions for a
workaround?

> I have the following code inside a form that submits via XHR:
>
> <button id="finalize_button" type="submit"
> onclick="finalizing();">Finalize Order</button>
>

Make sure you return true from the onclick function

like this

<button id="finalize_button" type="submit" onclick="finalizing();
return true;">Finalize Order</button>

if the onclick returns false it will prevent the default behavior of
the submit button
--
Edward Grant
themasternone@gmail.com

RPGA #342155
CAMARILLA #US2002022579

That didn't work - thanks for the suggestion though.

Wait, it's a form that submits via XHR?  How is the XHR hooked in, 
through
the finalizing() function?  Would help to see the rest of the code.

-Fred

On Thu, Jun 26, 2008 at 2:34 PM, Chris S <chris.sepic@gmail.com> wrote:

>
> That didn't work - thanks for the suggestion though.
>
> On Jun 26, 1:58 pm, "Edward Grant" <themastern...@gmail.com> wrote:
> > > I have the following code inside a form that submits via XHR:
> >
> > > <button id="finalize_button" type="submit"
> > > onclick="finalizing();">Finalize Order</button>


--
Science answers questions; philosophy questions answers.

Here's the <form> tag created by form_remote_tag:

<form action="/some/path" method="post" onsubmit="new Ajax.Request('/
some/path', {asynchronous:true, evalScripts:true,
parameters:Form.serialize(this)}); return false;">

Maybe I could manually trigger the forms onsubmit handler? How would I
do that?

You can't really do that.  $(myForm).submit() doesn't actually call the
onsubmit handler.  Why can't you do all the hook logic in your form 
submit
handler, and then conditionally allow the submit to proceed if it checks
out?

-Fred

On Thu, Jun 26, 2008 at 2:45 PM, Chris S <chris.sepic@gmail.com> wrote:

>
> Here's the <form> tag created by form_remote_tag:
>
> <form action="/some/path" method="post" onsubmit="new Ajax.Request('/
> some/path', {asynchronous:true, evalScripts:true,
> parameters:Form.serialize(this)}); return false;">
>
> Maybe I could manually trigger the forms onsubmit handler? How would I
> do that?


--
Science answers questions; philosophy questions answers.

On Thu, Jun 26, 2008 at 1:53 PM, Chris S <chris.sepic@gmail.com> wrote:
> finalizing() basically changes the button text and disables the button
> while the form is submitting. Works as expected in FF, but in Opera

If you disable a submit button before the form onsubmit event actually
fires, the form will not submit in IE and apparently, Opera. You need
to disable the submit button *after* the form onsubmit event has
occurred. This is typically achieved by adding an onStart() handler to
your Ajax request.

-justin

On Thu, Jun 26, 2008 at 2:46 PM, Justin Perkins 
<justinperkins@gmail.com> wrote:
> This is typically achieved by adding an onStart() handler

onStart is nothing, I mean onLoading.

<form onsubmit="new Ajax.Request('/foo/bar', { onLoading:function(){
$('submit_button').disable(); } })">
...
<input type="submit" id="submit_button" value="submit" />
</form>

(untested)

-justin

Justin/Frederick - Thanks, that did the trick. Here's my updated code:

<% form_remote_tag( :url => {:controller => 'store', :action =>
'finalize_order',
    :location_id => @location.id},
    :before => "finalizing();") do %>
...
<% end %>

That generates <form action="/some/path" method="post"
onsubmit="finalize(); new Ajax.Request('/
some/path', {asynchronous:true, evalScripts:true,
parameters:Form.serialize(this)}); return false;"> which is exactly
what I was after.