You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@wicket.apache.org by wholalotta <ar...@gmail.com> on 2011/10/05 23:51:03 UTC

ajax form submit, loading gif and swap panels

Hi all,

I want to remove the form component after hitting submit button and display
a loading animated gif.
After ajax submit operation finished, i want to display a new panel instead
of form component which has a button to generate a new form page..I think I
can swap the panels into onSubmit button but how can I check ajax request
finished or not and display a animated gif ?

		form.add(new AjaxButton("submit") {
	
			@Override
			protected void onSubmit(AjaxRequestTarget ajaxRequestTarget,Form form) {

                                       Processing some data in here..
			}

			@Override
			protected void onError(AjaxRequestTarget target, Form form) {
				super.onError();
				target.addComponent(feedbackPanel);
			}		

		});

Thanks


--
View this message in context: http://apache-wicket.1842946.n4.nabble.com/ajax-form-submit-loading-gif-and-swap-panels-tp3876326p3876326.html
Sent from the Users forum mailing list archive at Nabble.com.

---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: ajax form submit, loading gif and swap panels

Posted by manuelbarzi <ma...@gmail.com>.
may you try assembling wiquery to your web-app
(http://code.google.com/p/wiquery/). it makes jquery integration
trivial in wicket..



On Fri, Oct 7, 2011 at 1:22 PM, wholalotta <ar...@gmail.com> wrote:
> Any comment or documentation to learn how to call jquery function inside of
> this methot?
>
> Thanks
>
>
>
> --
> View this message in context: http://apache-wicket.1842946.n4.nabble.com/ajax-form-submit-loading-gif-and-swap-panels-tp3876326p3881810.html
> Sent from the Users forum mailing list archive at Nabble.com.
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>

---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: ajax form submit, loading gif and swap panels

Posted by wholalotta <ar...@gmail.com>.
Any comment or documentation to learn how to call jquery function inside of
this methot? 

Thanks



--
View this message in context: http://apache-wicket.1842946.n4.nabble.com/ajax-form-submit-loading-gif-and-swap-panels-tp3876326p3881810.html
Sent from the Users forum mailing list archive at Nabble.com.

---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: ajax form submit, loading gif and swap panels

Posted by wholalotta <ar...@gmail.com>.
Thanks guys..I overrided the methots and it worked. When I submit the form,
animated gif appears until ajax request is completed. But I dont know
javascripting so much so I couldnt
remove animated gif and fade out form div block at the same time..I want to
fade out the form area slowly and display a new message at the same place.
Any tip?


@Override
            protected IAjaxCallDecorator getAjaxCallDecorator()
            {
                return new AjaxCallDecorator()
                {          	
                	@Override
                	public CharSequence decorateScript(Component c,
CharSequence script)
                	{
                		return
"document.getElementById('loading').style.display='inline';" + script; 
                	}
                	
                    @Override
                	public CharSequence decorateOnSuccessScript(Component c,
CharSequence script)
                	{
                                return
"document.getElementById('loading').style.display='none';
*document.getElementById('container').fadeOut();*" + script; 
                	}          
                    
                    @Override
                	public CharSequence decorateOnFailureScript(Component c,
CharSequence script)
                	{
                    	return "alert('Failed');";
                	}

                };
            };

--
View this message in context: http://apache-wicket.1842946.n4.nabble.com/ajax-form-submit-loading-gif-and-swap-panels-tp3876326p3879973.html
Sent from the Users forum mailing list archive at Nabble.com.

---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: ajax form submit, loading gif and swap panels

Posted by Martin Grigorov <mg...@apache.org>.
On Thu, Oct 6, 2011 at 1:08 AM, Dan Retzlaff <dr...@gmail.com> wrote:
> If you override AjaxSubmitLink#getAjaxCallDecorator() you can add JavaScript
> to the link's onclick attribute to show your animated gif. When the AJAX
> request eventually returns, it can replace whatever container has the gif.
Or use the same AjaxCallDecorator and remove the gif in its
onDecorateSuccess()/onDecorateFailure() one of which will be executed
at the end of the Ajax request.
>
> On Wed, Oct 5, 2011 at 2:51 PM, wholalotta <ar...@gmail.com> wrote:
>
>> Hi all,
>>
>> I want to remove the form component after hitting submit button and display
>> a loading animated gif.
>> After ajax submit operation finished, i want to display a new panel instead
>> of form component which has a button to generate a new form page..I think I
>> can swap the panels into onSubmit button but how can I check ajax request
>> finished or not and display a animated gif ?
>>
>>                form.add(new AjaxButton("submit") {
>>
>>                        @Override
>>                        protected void onSubmit(AjaxRequestTarget
>> ajaxRequestTarget,Form form) {
>>
>>                                       Processing some data in here..
>>                        }
>>
>>                        @Override
>>                        protected void onError(AjaxRequestTarget target,
>> Form form) {
>>                                super.onError();
>>                                target.addComponent(feedbackPanel);
>>                        }
>>
>>                });
>>
>> Thanks
>>
>>
>> --
>> View this message in context:
>> http://apache-wicket.1842946.n4.nabble.com/ajax-form-submit-loading-gif-and-swap-panels-tp3876326p3876326.html
>> Sent from the Users forum mailing list archive at Nabble.com.
>>
>> ---------------------------------------------------------------------
>> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
>> For additional commands, e-mail: users-help@wicket.apache.org
>>
>>
>



-- 
Martin Grigorov
jWeekend
Training, Consulting, Development
http://jWeekend.com

---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: ajax form submit, loading gif and swap panels

Posted by Dan Retzlaff <dr...@gmail.com>.
If you override AjaxSubmitLink#getAjaxCallDecorator() you can add JavaScript
to the link's onclick attribute to show your animated gif. When the AJAX
request eventually returns, it can replace whatever container has the gif.

On Wed, Oct 5, 2011 at 2:51 PM, wholalotta <ar...@gmail.com> wrote:

> Hi all,
>
> I want to remove the form component after hitting submit button and display
> a loading animated gif.
> After ajax submit operation finished, i want to display a new panel instead
> of form component which has a button to generate a new form page..I think I
> can swap the panels into onSubmit button but how can I check ajax request
> finished or not and display a animated gif ?
>
>                form.add(new AjaxButton("submit") {
>
>                        @Override
>                        protected void onSubmit(AjaxRequestTarget
> ajaxRequestTarget,Form form) {
>
>                                       Processing some data in here..
>                        }
>
>                        @Override
>                        protected void onError(AjaxRequestTarget target,
> Form form) {
>                                super.onError();
>                                target.addComponent(feedbackPanel);
>                        }
>
>                });
>
> Thanks
>
>
> --
> View this message in context:
> http://apache-wicket.1842946.n4.nabble.com/ajax-form-submit-loading-gif-and-swap-panels-tp3876326p3876326.html
> Sent from the Users forum mailing list archive at Nabble.com.
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>