You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@tapestry.apache.org by "Daniel Anguita O." <an...@austec.cl> on 2007/01/16 14:02:23 UTC
Ajax Loading Indicator (google style)
Hello all.
I'm using Tapestry 4.1.1 and i'm learning to use ajax with it.
Now i'm trying to make a loading indicator for ajax request when are
loading, like google. So i make a simple div like this:
<div id="loader" class="loader">Loading...</div>
and i want to make it visible when i run an EventListener and when it's
finish, make it invisible. In other frameworks making this was very
easy, but i dont know how to make it with Dojo, using something like
Dojo.byId("loader").Show <- when i get "onloading" ajax thing.
Dojo.byId("loader").Hide <- and whern i get "oncomplete" ajax thing.
Anyone knows any way to do this? Theres is something like
updateComponent to make it visible and invisible?
Cheers
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
For additional commands, e-mail: users-help@tapestry.apache.org
Re: Ajax Loading Indicator (google style)
Posted by andyhot <an...@di.uoa.gr>.
Well, that's a fresh one...
https://svn.apache.org/repos/asf/tapestry/tapestry4/trunk/tapestry-framework/src/js/tapestry/fx.js
See the tapestry.fx.attachAjaxStatus function and its docs, I think
you'll like it.
scv wrote:
> Hi Daniel,
>
> I was searching for a solution for this problem too. Now I have found a
> solution.
> Just put this code in you HTMLtemplate.
>
> ---------------------------------------------------------------------------------------------------
> <div id="loading" style="opacity: 0;">loading...</div>
>
> <script type="text/javascript">
> dojo.require("dojo.lfx");
> dojo.addOnLoad(function(e) {
> dojo.event.connect(tapestry, "loadContent", function(){
> document.body.style.cursor="default";
> dojo.lfx.html.fadeOut("loading", 300).play();
> });
> dojo.event.connect(tapestry, "linkOnClick", function(){
> document.body.style.cursor="wait";
> dojo.lfx.html.fadeIn("loading", 300).play();
> });
> });
> </script>
> ---------------------------------------------------------------------------------------------------
>
> Best regards,
> Christian Grail
>
>
> Daniel Anguita O. wrote:
>
>> Hello all.
>>
>> I'm using Tapestry 4.1.1 and i'm learning to use ajax with it.
>> Now i'm trying to make a loading indicator for ajax request when are
>> loading, like google. So i make a simple div like this:
>>
>> <div id="loader" class="loader">Loading...</div>
>>
>> and i want to make it visible when i run an EventListener and when it's
>> finish, make it invisible. In other frameworks making this was very
>> easy, but i dont know how to make it with Dojo, using something like
>>
>> Dojo.byId("loader").Show <- when i get "onloading" ajax thing.
>> Dojo.byId("loader").Hide <- and whern i get "oncomplete" ajax thing.
>>
>> Anyone knows any way to do this? Theres is something like
>> updateComponent to make it visible and invisible?
>>
>> Cheers
>>
>> ---------------------------------------------------------------------
>> To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
>> For additional commands, e-mail: users-help@tapestry.apache.org
>>
>>
>>
>>
>
>
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
For additional commands, e-mail: users-help@tapestry.apache.org
Re: [WARNING] Ajax Loading Indicator (google style)
Posted by scv <ch...@gmx.de>.
Hi Daniel,
I was searching for a solution for this problem too. Now I have found a
solution.
Just put this code in you HTMLtemplate.
---------------------------------------------------------------------------------------------------
<div id="loading" style="opacity: 0;">loading...</div>
<script type="text/javascript">
dojo.require("dojo.lfx");
dojo.addOnLoad(function(e) {
dojo.event.connect(tapestry, "loadContent", function(){
document.body.style.cursor="default";
dojo.lfx.html.fadeOut("loading", 300).play();
});
dojo.event.connect(tapestry, "linkOnClick", function(){
document.body.style.cursor="wait";
dojo.lfx.html.fadeIn("loading", 300).play();
});
});
</script>
---------------------------------------------------------------------------------------------------
Best regards,
Christian Grail
Daniel Anguita O. wrote:
>
> Hello all.
>
> I'm using Tapestry 4.1.1 and i'm learning to use ajax with it.
> Now i'm trying to make a loading indicator for ajax request when are
> loading, like google. So i make a simple div like this:
>
> <div id="loader" class="loader">Loading...</div>
>
> and i want to make it visible when i run an EventListener and when it's
> finish, make it invisible. In other frameworks making this was very
> easy, but i dont know how to make it with Dojo, using something like
>
> Dojo.byId("loader").Show <- when i get "onloading" ajax thing.
> Dojo.byId("loader").Hide <- and whern i get "oncomplete" ajax thing.
>
> Anyone knows any way to do this? Theres is something like
> updateComponent to make it visible and invisible?
>
> Cheers
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
> For additional commands, e-mail: users-help@tapestry.apache.org
>
>
>
--
View this message in context: http://www.nabble.com/Ajax-Loading-Indicator-%28google-style%29-tf3020804.html#a8985370
Sent from the Tapestry - User mailing list archive at Nabble.com.
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
For additional commands, e-mail: users-help@tapestry.apache.org