You are viewing a plain text version of this content. The canonical link for it is here.
Posted to user@struts.apache.org by ulf n <ul...@hotmail.com> on 2009/02/10 15:52:34 UTC

submitting a form without a submit button ajax-style

Hi! all

I'm trying to find a way to submit a form ajax-style without a submit button (Without a page reload).

Is it possible at all? Google has been to no avail :(


the Form:

<s:form theme="ajax" action="MyAction" id="myStatusForm">
      <s:hidden name="statusdate"/>
      <s:checkbox theme="ajax" name="status" value="status" onclick="javascript:someHowSubmitTheFormWithoutReload();"></s:checkbox>
</s:form>            



TIA
Ulf

_________________________________________________________________
News, entertainment and everything you care about at Live.com. Get it now!
http://www.live.com/getstarted.aspx

Re: submitting a form without a submit button ajax-style

Posted by Wes Wannemacher <we...@wantii.com>.
On Tuesday 10 February 2009 10:52:33 Sonny Gill wrote:
> If using Prototype, you can do it using the Form object.
> See http://www.prototypejs.org/api/form/request
>
> Similarly, Dojo or whatever other library you use should have a way of
> submitting the form by an Ajax request.
>
> Cheers,
> Sonny
>
> On Tue, Feb 10, 2009 at 10:52 PM, ulf n <ul...@hotmail.com> wrote:
> > Hi! all
> >
> > I'm trying to find a way to submit a form ajax-style without a submit
> > button (Without a page reload). TIA
> > Ulf
>

If you're a JQuery fan, I have an app setup for my upcoming book here - 

http://code.google.com/p/struts2inpractice/source/browse/#svn/trunk/ch04ex01

It's the ch04ex01 example app. It's Struts2 + Conventions + JQuery + JSON + 
Spring + JPA/Hibernate + HSQLDB. It's sort of a rewrite of Musachy's app 
available here - 

http://struts.apache.org/2.x/docs/struts-2-spring-2-jpa-ajax.html

The lack of source comments is not due to my poor coding skills, but because 
it's part of the publishers' standards. It's pretty straightforward, if you're 
already somewhat familiar with S2/Spring/JQuery/etc. 

-Wes
-- 

Wes Wannemacher
Author - Struts 2 In Practice 
Includes coverage of Struts 2.1, Spring, JPA, JQuery, Sitemesh and more
http://www.manning.com/wannemacher


---------------------------------------------------------------------
To unsubscribe, e-mail: user-unsubscribe@struts.apache.org
For additional commands, e-mail: user-help@struts.apache.org


Re: submitting a form without a submit button ajax-style

Posted by Sonny Gill <so...@gmail.com>.
If using Prototype, you can do it using the Form object.
See http://www.prototypejs.org/api/form/request

Similarly, Dojo or whatever other library you use should have a way of
submitting the form by an Ajax request.

Cheers,
Sonny

On Tue, Feb 10, 2009 at 10:52 PM, ulf n <ul...@hotmail.com> wrote:
>
> Hi! all
>
> I'm trying to find a way to submit a form ajax-style without a submit button (Without a page reload).
> TIA
> Ulf

---------------------------------------------------------------------
To unsubscribe, e-mail: user-unsubscribe@struts.apache.org
For additional commands, e-mail: user-help@struts.apache.org


Re: submitting a form without a submit button ajax-style

Posted by mitch gorman <mg...@shadowtv.biz>.
Musachy Barroso wrote:
> 2.1.6 is GA :)
>   

    DOH!

    hadn't checked in a while, obviously...

---------------------------------------------------------------------
To unsubscribe, e-mail: user-unsubscribe@struts.apache.org
For additional commands, e-mail: user-help@struts.apache.org


Re: submitting a form without a submit button ajax-style

Posted by Musachy Barroso <mu...@gmail.com>.
2.1.6 is GA :)

musachy

On Wed, Feb 11, 2009 at 3:35 PM, mitch gorman <mg...@shadowtv.biz> wrote:
> Musachy Barroso wrote:
>> What you are looking for is the "bind" tag. Check:
>>
>> http://struts.apache.org/2.x/docs/bind.html
>>
>> in your example:
>>
>> <s:form action="MyAction" id="myStatusForm">
>>      <s:hidden name="statusdate"/>
>>      <s:checkbox theme="ajax" name="status" value="status" id="statusCheckbox"/>
>> </s:form>
>> <sx:bind src="statusCheckbox" events="onclick"
>> showLoadingText="false" formId="myStatusForm"/>
>>
>> Look at the docs, the "bind" tag can do a few other tricks.
>>
>    i have looked at the docs and drooled over the bind tag quite a
> bit... unfortunately, we're staying with the GA release, leaving me in
> 2.0.x land.  bind would've taken care of *so* many of the little gotchas
> i've run into...
>
>    is there any ETA for a GA v2.1.x (or, if you're following the linux
> paradigm, a v2.2.x) release?
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: user-unsubscribe@struts.apache.org
> For additional commands, e-mail: user-help@struts.apache.org
>
>



-- 
"Hey you! Would you help me to carry the stone?" Pink Floyd

---------------------------------------------------------------------
To unsubscribe, e-mail: user-unsubscribe@struts.apache.org
For additional commands, e-mail: user-help@struts.apache.org


Re: submitting a form without a submit button ajax-style

Posted by Dave Newton <ne...@yahoo.com>.
mitch gorman wrote:
>     i have looked at the docs and drooled over the bind tag quite a
> bit... unfortunately, we're staying with the GA release, leaving me in
> 2.0.x land.  bind would've taken care of *so* many of the little gotchas
> i've run into...
> 
>     is there any ETA for a GA v2.1.x (or, if you're following the linux
> paradigm, a v2.2.x) release?

2.1.6 has been GA for awhile now.

Dave


---------------------------------------------------------------------
To unsubscribe, e-mail: user-unsubscribe@struts.apache.org
For additional commands, e-mail: user-help@struts.apache.org


Re: submitting a form without a submit button ajax-style

Posted by mitch gorman <mg...@shadowtv.biz>.
Musachy Barroso wrote:
> What you are looking for is the "bind" tag. Check:
>
> http://struts.apache.org/2.x/docs/bind.html
>
> in your example:
>
> <s:form action="MyAction" id="myStatusForm">
>      <s:hidden name="statusdate"/>
>      <s:checkbox theme="ajax" name="status" value="status" id="statusCheckbox"/>
> </s:form>
> <sx:bind src="statusCheckbox" events="onclick"
> showLoadingText="false" formId="myStatusForm"/>
>
> Look at the docs, the "bind" tag can do a few other tricks.
>   
    i have looked at the docs and drooled over the bind tag quite a
bit... unfortunately, we're staying with the GA release, leaving me in
2.0.x land.  bind would've taken care of *so* many of the little gotchas
i've run into...

    is there any ETA for a GA v2.1.x (or, if you're following the linux
paradigm, a v2.2.x) release?


---------------------------------------------------------------------
To unsubscribe, e-mail: user-unsubscribe@struts.apache.org
For additional commands, e-mail: user-help@struts.apache.org


Re: submitting a form without a submit button ajax-style

Posted by Musachy Barroso <mu...@gmail.com>.
What you are looking for is the "bind" tag. Check:

http://struts.apache.org/2.x/docs/bind.html

in your example:

<s:form action="MyAction" id="myStatusForm">
     <s:hidden name="statusdate"/>
     <s:checkbox theme="ajax" name="status" value="status" id="statusCheckbox"/>
</s:form>
<sx:bind src="statusCheckbox" events="onclick"
showLoadingText="false" formId="myStatusForm"/>

Look at the docs, the "bind" tag can do a few other tricks.

musachy


On Tue, Feb 10, 2009 at 9:52 AM, ulf n <ul...@hotmail.com> wrote:
>
> Hi! all
>
> I'm trying to find a way to submit a form ajax-style without a submit button (Without a page reload).
>
> Is it possible at all? Google has been to no avail :(
>
>
> the Form:
>
> <s:form theme="ajax" action="MyAction" id="myStatusForm">
>      <s:hidden name="statusdate"/>
>      <s:checkbox theme="ajax" name="status" value="status" onclick="javascript:someHowSubmitTheFormWithoutReload();"></s:checkbox>
> </s:form>
>
>
>
> TIA
> Ulf
>
> _________________________________________________________________
> News, entertainment and everything you care about at Live.com. Get it now!
> http://www.live.com/getstarted.aspx



-- 
"Hey you! Would you help me to carry the stone?" Pink Floyd

---------------------------------------------------------------------
To unsubscribe, e-mail: user-unsubscribe@struts.apache.org
For additional commands, e-mail: user-help@struts.apache.org


RE: submitting a form without a submit button ajax-style

Posted by ulf n <ul...@hotmail.com>.
thanks a bunch! I'll try it out :)

cheers,
Ulf

> Date: Wed, 11 Feb 2009 17:51:56 +0000
> Subject: Re: submitting a form without a submit button ajax-style
> From: felipefraga@gmail.com
> To: user@struts.apache.org
> 
> Hello,
> 
> Using Struts 2 built-in dojo, you could just:
> 
> function submitForm(namespace, action, formName, targetDivName) {
> 	var theForm = dojo.byId( formName );
> 	//remove initial slash
> 	var theUrl = namespace.substring(1,namespace.length) + "/" + action +
> ".action";
> 	dojo.io.bind({
> 		url: theUrl,
> 		formNode: theForm,
> 		load : function(type, data) {  dojo.byId( targetDivName ).innerHTML = data;},
> 		error: function(type, error){  dojo.byId( targetDivName ).innerHTML
> = error.message;  },
> 		mimeType :"text/html",
> 		method: "POST"
> 	});
> }
> 
> If you suppress the url, the form action is used instead.
> 
> 
> Regards,
> 
> Felipe Fraga
> 
> 
> On Wed, Feb 11, 2009 at 2:55 PM, mitch gorman <mg...@shadowtv.biz> wrote:
> > ulf n wrote:
> >> Thanks for all the input on this one!
> >>
> >> alas the form.submit(), causes a reload of the page :(
> >>
> >    doh!
> >
> >    okay, so the issue is, you need the 'targets=""' attribute, but
> > unfortunately for you, s:select doesn't have that bad boy.  what i think
> > you'll need to do, to get around this is to use listenTopics="/after" on
> > the s:div you're trying to update, and change submitForm() to
> >
> >
> > <script type="text/javascript">
> >    function submitForm(id) {
> >        var form = document.getElementById(id);
> >        form.submit();
> >        dojo.event.topic.publish('/after');
> >    }
> > </script>
> >
> >    i have not tested this, so i'm not certain this will work.  it's
> > possible (but unlikely) that the publish might need to occur before the
> > form.submit(), so try that, too, if the function shown above doesn't do
> > the job.
> >
> >    if this doesn't work for ya, i got nothin'.  good luck.
> >
> >
> > ---------------------------------------------------------------------
> > To unsubscribe, e-mail: user-unsubscribe@struts.apache.org
> > For additional commands, e-mail: user-help@struts.apache.org
> >
> >
> 
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: user-unsubscribe@struts.apache.org
> For additional commands, e-mail: user-help@struts.apache.org
> 

_________________________________________________________________
Drag n’ drop—Get easy photo sharing with Windows Live™ Photos.

http://www.microsoft.com/windows/windowslive/products/photos.aspx

Re: submitting a form without a submit button ajax-style

Posted by mitch gorman <mg...@shadowtv.biz>.
Felipe Fraga wrote:
> Hello,
>
> Using Struts 2 built-in dojo, you could just:
>
> function submitForm(namespace, action, formName, targetDivName) {
> 	var theForm = dojo.byId( formName );
> 	//remove initial slash
> 	var theUrl = namespace.substring(1,namespace.length) + "/" + action +
> ".action";
> 	dojo.io.bind({
> 		url: theUrl,
> 		formNode: theForm,
> 		load : function(type, data) {  dojo.byId( targetDivName ).innerHTML = data;},
> 		error: function(type, error){  dojo.byId( targetDivName ).innerHTML
> = error.message;  },
> 		mimeType :"text/html",
> 		method: "POST"
> 	});
> }
>
> If you suppress the url, the form action is used instead.
>   

    clearly, a much better solution than mine.  felipe, did my
suggestion even have a shot of working?  i don't know dojo internals,
and i'm hardly a "javascript programmer"... knowing only enough to get
myself in trouble...


---------------------------------------------------------------------
To unsubscribe, e-mail: user-unsubscribe@struts.apache.org
For additional commands, e-mail: user-help@struts.apache.org


Re: submitting a form without a submit button ajax-style

Posted by Felipe Fraga <fe...@gmail.com>.
Hello,

Using Struts 2 built-in dojo, you could just:

function submitForm(namespace, action, formName, targetDivName) {
	var theForm = dojo.byId( formName );
	//remove initial slash
	var theUrl = namespace.substring(1,namespace.length) + "/" + action +
".action";
	dojo.io.bind({
		url: theUrl,
		formNode: theForm,
		load : function(type, data) {  dojo.byId( targetDivName ).innerHTML = data;},
		error: function(type, error){  dojo.byId( targetDivName ).innerHTML
= error.message;  },
		mimeType :"text/html",
		method: "POST"
	});
}

If you suppress the url, the form action is used instead.


Regards,

Felipe Fraga


On Wed, Feb 11, 2009 at 2:55 PM, mitch gorman <mg...@shadowtv.biz> wrote:
> ulf n wrote:
>> Thanks for all the input on this one!
>>
>> alas the form.submit(), causes a reload of the page :(
>>
>    doh!
>
>    okay, so the issue is, you need the 'targets=""' attribute, but
> unfortunately for you, s:select doesn't have that bad boy.  what i think
> you'll need to do, to get around this is to use listenTopics="/after" on
> the s:div you're trying to update, and change submitForm() to
>
>
> <script type="text/javascript">
>    function submitForm(id) {
>        var form = document.getElementById(id);
>        form.submit();
>        dojo.event.topic.publish('/after');
>    }
> </script>
>
>    i have not tested this, so i'm not certain this will work.  it's
> possible (but unlikely) that the publish might need to occur before the
> form.submit(), so try that, too, if the function shown above doesn't do
> the job.
>
>    if this doesn't work for ya, i got nothin'.  good luck.
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: user-unsubscribe@struts.apache.org
> For additional commands, e-mail: user-help@struts.apache.org
>
>

---------------------------------------------------------------------
To unsubscribe, e-mail: user-unsubscribe@struts.apache.org
For additional commands, e-mail: user-help@struts.apache.org


Re: submitting a form without a submit button ajax-style

Posted by mitch gorman <mg...@shadowtv.biz>.
ulf n wrote:
> Thanks for all the input on this one!
>  
> alas the form.submit(), causes a reload of the page :(
>   
    doh! 

    okay, so the issue is, you need the 'targets=""' attribute, but
unfortunately for you, s:select doesn't have that bad boy.  what i think
you'll need to do, to get around this is to use listenTopics="/after" on
the s:div you're trying to update, and change submitForm() to


<script type="text/javascript">
    function submitForm(id) {
        var form = document.getElementById(id);
        form.submit();
	dojo.event.topic.publish('/after');
    }
</script>

    i have not tested this, so i'm not certain this will work.  it's
possible (but unlikely) that the publish might need to occur before the
form.submit(), so try that, too, if the function shown above doesn't do
the job.

    if this doesn't work for ya, i got nothin'.  good luck.


---------------------------------------------------------------------
To unsubscribe, e-mail: user-unsubscribe@struts.apache.org
For additional commands, e-mail: user-help@struts.apache.org


Re: submitting a form without a submit button ajax-style

Posted by Musachy Barroso <mu...@gmail.com>.
some browsers support "form.submit();return false", but save yourself
the pain of using that :)

musachy

On Wed, Feb 11, 2009 at 9:14 AM, ulf n <ul...@hotmail.com> wrote:
>
> Thanks for all the input on this one!
>
> alas the form.submit(), causes a reload of the page :(
>
> thanks,
> Ulf> Date: Wed, 11 Feb 2009 08:37:06 -0500> From: mgorman@shadowtv.biz> To: user@struts.apache.org> Subject: Re: submitting a form without a submit button ajax-style> > ulf n wrote:> > the Form:> >> > <s:form theme="ajax" action="MyAction" id="myStatusForm">> > <s:hidden name="statusdate"/>> > <s:checkbox theme="ajax" name="status" value="status" onclick="javascript:someHowSubmitTheFormWithoutReload();"></s:checkbox>> > </s:form> > > > the modified form:> > <s:form theme="ajax" action="MyAction" id="myStatusForm">> <s:hidden name="statusdate"/>> <s:checkbox theme="ajax" name="status" value="status"> onclick="submitForm('myStatusForm');" />> </s:form>> > > the javascript:> > <script type="text/javascript">> function submitForm(id) {> var form = document.getElementById(id);> form.submit();> }> </script>> > that should do ya. i'm sure it can be done without requiring a> separate function, i.e., set onclick to directly submit the form... but> this is a more general purpose solution, anyway.> > ---------------------------------------------------------------------> To unsubscribe, e-mail: user-unsubscribe@struts.apache.org> For additional commands, e-mail: user-help@struts.apache.org>
> _________________________________________________________________
> Show them the way! Add maps and directions to your party invites.
> http://www.microsoft.com/windows/windowslive/products/events.aspx



-- 
"Hey you! Would you help me to carry the stone?" Pink Floyd

---------------------------------------------------------------------
To unsubscribe, e-mail: user-unsubscribe@struts.apache.org
For additional commands, e-mail: user-help@struts.apache.org


RE: submitting a form without a submit button ajax-style

Posted by ulf n <ul...@hotmail.com>.
Thanks for all the input on this one!
 
alas the form.submit(), causes a reload of the page :(
 
thanks,
Ulf> Date: Wed, 11 Feb 2009 08:37:06 -0500> From: mgorman@shadowtv.biz> To: user@struts.apache.org> Subject: Re: submitting a form without a submit button ajax-style> > ulf n wrote:> > the Form:> >> > <s:form theme="ajax" action="MyAction" id="myStatusForm">> > <s:hidden name="statusdate"/>> > <s:checkbox theme="ajax" name="status" value="status" onclick="javascript:someHowSubmitTheFormWithoutReload();"></s:checkbox>> > </s:form> > > > the modified form:> > <s:form theme="ajax" action="MyAction" id="myStatusForm">> <s:hidden name="statusdate"/>> <s:checkbox theme="ajax" name="status" value="status"> onclick="submitForm('myStatusForm');" />> </s:form>> > > the javascript:> > <script type="text/javascript">> function submitForm(id) {> var form = document.getElementById(id);> form.submit();> }> </script>> > that should do ya. i'm sure it can be done without requiring a> separate function, i.e., set onclick to directly submit the form... but> this is a more general purpose solution, anyway.> > ---------------------------------------------------------------------> To unsubscribe, e-mail: user-unsubscribe@struts.apache.org> For additional commands, e-mail: user-help@struts.apache.org> 
_________________________________________________________________
Show them the way! Add maps and directions to your party invites. 
http://www.microsoft.com/windows/windowslive/products/events.aspx

Re: submitting a form without a submit button ajax-style

Posted by mitch gorman <mg...@shadowtv.biz>.
ulf n wrote:
> the Form:
>
> <s:form theme="ajax" action="MyAction" id="myStatusForm">
>       <s:hidden name="statusdate"/>
>       <s:checkbox theme="ajax" name="status" value="status" onclick="javascript:someHowSubmitTheFormWithoutReload();"></s:checkbox>
> </s:form>            
>   
    the modified form:

<s:form theme="ajax" action="MyAction" id="myStatusForm">
      <s:hidden name="statusdate"/>
      <s:checkbox theme="ajax" name="status" value="status"
            onclick="submitForm('myStatusForm');" />
</s:form>


    the javascript:

<script type="text/javascript">
    function submitForm(id) {
        var form = document.getElementById(id);
        form.submit();
    }
</script>

    that should do ya.  i'm sure it can be done without requiring a
separate function, i.e., set onclick to directly submit the form... but
this is a more general purpose solution, anyway.

---------------------------------------------------------------------
To unsubscribe, e-mail: user-unsubscribe@struts.apache.org
For additional commands, e-mail: user-help@struts.apache.org