You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@tapestry.apache.org by Hugo Palma <hu...@gmail.com> on 2010/11/23 12:56:55 UTC
Disabling submit button after click
I would like to disable a form submit button after click in order to avoid
multiple clicking.
This can easily be done by calling "this.disabled = true" on the onclick
event of the button but this also prevents the submit event from executing.
I could do "this.disabled = true;form.submit()" but in my case i have an
ajax form with the zone parameter and the form.submit() forces the "normal"
submit with full page reload.
So, any idea how i can disable the submit button and not cancel the ajax
form submit ?
Thanks,
Hugo
--
LinkedIn <http://www.linkedin.com/in/hugopalma>
Twitter<http://twitter.com/hugompalma>
Re: Disabling submit button after click
Posted by Ulrich Stärk <ul...@spielviel.de>.
Do you update the portion of the page that contains the form upon the ajax submit? If yes you can
bind the disabled parameter of the submit button to some page property and set that to true in your
submit handler method.
Uli
On 23.11.2010 12:56, Hugo Palma wrote:
> I would like to disable a form submit button after click in order to avoid
> multiple clicking.
> This can easily be done by calling "this.disabled = true" on the onclick
> event of the button but this also prevents the submit event from executing.
>
> I could do "this.disabled = true;form.submit()" but in my case i have an
> ajax form with the zone parameter and the form.submit() forces the "normal"
> submit with full page reload.
> So, any idea how i can disable the submit button and not cancel the ajax
> form submit ?
>
> Thanks,
> Hugo
>
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
For additional commands, e-mail: users-help@tapestry.apache.org
Re: Disabling submit button after click
Posted by Hugo Palma <hu...@gmail.com>.
Thanks for all the help.
I've just figured out how to get this working. Here's the mixin code in case
anyone needs similar functionality:
@Import(library = "disableAfterSubmit.js")
public class DisableAfterSubmit {
@Inject
private JavaScriptSupport javaScriptSupport;
@InjectContainer
private ClientElement element;
@Environmental
private FormSupport formSupport;
/**
* Adds content to the bottom of the component.
*/
@AfterRender
public void afterRender() {
javaScriptSupport.addScript(String.format("new
DisableAfterSubmit('%s', '%s');", element.getClientId(),
formSupport.getClientId()));
}
}
disableAfterSubmit.js
var DisableAfterSubmit = Class.create();
DisableAfterSubmit.prototype = {
initialize: function(elementId, formId) {
this.formId = formId;
this.elementId = elementId;
Event.observe($(elementId), 'click',
this.doDisable.bindAsEventListener(this));
},
doDisable: function(e) {
$(this.elementId).disable();
$(this.formId).onsubmit();
}
}
On Tue, Nov 23, 2010 at 13:01, Newham, Cameron <ca...@bl.uk> wrote:
> It's exactly this kind of thing that should appear as an example on the
> new website.
>
> c.
>
> -----Original Message-----
> From: Inge Solvoll [mailto:inge.tapestry@gmail.com]
> Sent: 23 November 2010 12:36
> To: Tapestry users
> Subject: Re: Disabling submit button after click
>
> Easy:
>
> Create a mixin that:
> - uses javascript to apply "disabled"-looking css styles when clicking
> the
> button
> - hooks a javascript handler to the button that cancels future submits.
> - on AJAX return, revert 2 previous actions from a javascript listener.
>
> On Tue, Nov 23, 2010 at 12:56 PM, Hugo Palma <hu...@gmail.com>
> wrote:
>
> > I would like to disable a form submit button after click in order to
> avoid
> > multiple clicking.
> > This can easily be done by calling "this.disabled = true" on the
> onclick
> > event of the button but this also prevents the submit event from
> executing.
> >
> > I could do "this.disabled = true;form.submit()" but in my case i have
> an
> > ajax form with the zone parameter and the form.submit() forces the
> "normal"
> > submit with full page reload.
> > So, any idea how i can disable the submit button and not cancel the
> ajax
> > form submit ?
> >
> > Thanks,
> > Hugo
> >
> > --
> >
> > LinkedIn <http://www.linkedin.com/in/hugopalma>
> > Twitter<http://twitter.com/hugompalma>
> >
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
> For additional commands, e-mail: users-help@tapestry.apache.org
>
>
--
LinkedIn <http://www.linkedin.com/in/hugopalma>
Twitter<http://twitter.com/hugompalma>
RE: Disabling submit button after click
Posted by "Newham, Cameron" <ca...@bl.uk>.
It's exactly this kind of thing that should appear as an example on the
new website.
c.
-----Original Message-----
From: Inge Solvoll [mailto:inge.tapestry@gmail.com]
Sent: 23 November 2010 12:36
To: Tapestry users
Subject: Re: Disabling submit button after click
Easy:
Create a mixin that:
- uses javascript to apply "disabled"-looking css styles when clicking
the
button
- hooks a javascript handler to the button that cancels future submits.
- on AJAX return, revert 2 previous actions from a javascript listener.
On Tue, Nov 23, 2010 at 12:56 PM, Hugo Palma <hu...@gmail.com>
wrote:
> I would like to disable a form submit button after click in order to
avoid
> multiple clicking.
> This can easily be done by calling "this.disabled = true" on the
onclick
> event of the button but this also prevents the submit event from
executing.
>
> I could do "this.disabled = true;form.submit()" but in my case i have
an
> ajax form with the zone parameter and the form.submit() forces the
"normal"
> submit with full page reload.
> So, any idea how i can disable the submit button and not cancel the
ajax
> form submit ?
>
> Thanks,
> Hugo
>
> --
>
> LinkedIn <http://www.linkedin.com/in/hugopalma>
> Twitter<http://twitter.com/hugompalma>
>
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
For additional commands, e-mail: users-help@tapestry.apache.org
Re: Disabling submit button after click
Posted by Inge Solvoll <in...@gmail.com>.
Easy:
Create a mixin that:
- uses javascript to apply "disabled"-looking css styles when clicking the
button
- hooks a javascript handler to the button that cancels future submits.
- on AJAX return, revert 2 previous actions from a javascript listener.
On Tue, Nov 23, 2010 at 12:56 PM, Hugo Palma <hu...@gmail.com> wrote:
> I would like to disable a form submit button after click in order to avoid
> multiple clicking.
> This can easily be done by calling "this.disabled = true" on the onclick
> event of the button but this also prevents the submit event from executing.
>
> I could do "this.disabled = true;form.submit()" but in my case i have an
> ajax form with the zone parameter and the form.submit() forces the "normal"
> submit with full page reload.
> So, any idea how i can disable the submit button and not cancel the ajax
> form submit ?
>
> Thanks,
> Hugo
>
> --
>
> LinkedIn <http://www.linkedin.com/in/hugopalma>
> Twitter<http://twitter.com/hugompalma>
>