Ok. So I finally figured out my javascript syntax mistake. Do not use
Wicket.Ajax.registerPreCallHandler(showBusysign()) but instead without
the brackets with the function:
Wicket.Ajax.registerPreCallHandler(showBusysign);
This snipplet is now complete and can be used with any application:
<script type="text/javascript">
/* Your web page must contain this:
* <div id="busysign">Loading ...</div>
*/
window.onload = setupFunc;
function setupFunc() {
document.getElementsByTagName('body')[0].onclick = clickFunc;
hideBusysign();
Wicket.Ajax.registerPreCallHandler(showBusysign);
Wicket.Ajax.registerPostCallHandler(hideBusysign);
Wicket.Ajax.registerFailureHandler(hideBusysign);
}
function hideBusysign() {
document.getElementById('busysign').style.display ='none';
}
function showBusysign() {
document.getElementById('busysign').style.display ='inline';
}
function clickFunc(eventData) {
var clickedElement = (window.event) ? event.srcElement : eventData.target;
if (clickedElement.tagName == 'BUTTON' || clickedElement.tagName
== 'A' || clickedElement.parentNode.tagName == 'A'
|| (clickedElement.tagName == 'INPUT' && (clickedElement.type ==
'BUTTON' || clickedElement.type == 'SUBMIT'))) {
showBusysign();
}
}
</script>
Do you think I should add it to the WIKI?
**
Martin
2008/6/8 Martin Makundi <[EMAIL PROTECTED]>:
> Hi!
>
> In my understanding it should (IMHO) be possible to hook all ajax
> calls without doing anything on the server side. I think your "add
> onClick to an AjaxButton" issue involves attaching specific javascript
> (from the server side) to a specific button. That's not what I need,
> is it? I would have to roll out a new global ajax button having the
> amendments....no. That's an overkill (is it the only solution???).
>
> I just want the indicator to become visible whenever any ajax request
> starts and the indicator to be again hidden whenever the ajax request
> stops/terminates. I do not want to affect the ajax behavior itself, I
> just want to add one intermediate function call.
>
> There should be a generic clicent-side (browser) hook or way to tweak
> this. I tried chaning the body onload setupfunc to the following,
> which had the result that all ajaxfallbackbuttons fell back into
> normal mode:
>
> function setupFunc() {
> document.getElementsByTagName('body')[0].onclick = clickFunc;
> hideBusysign();
> Wicket.Ajax.registerPreCallHandler(showBusysign());
> Wicket.Ajax.registerPostCallHandler(hideBusysign());
> Wicket.Ajax.registerFailureHandler(hideBusysign());
> }
>
> So I just want to add the show/hideBusysign in addition to the
> existing functionality. Do I have to fork wicket-ajax.js or is it
> possible to achieve it using scripting within the markup file?
>
> **
> Martin
>
> 2008/6/8 Eyal Golan <[EMAIL PROTECTED]>:
>> check my posts on "add onClick to an AjaxButton" in the users list (I
>> couldn't get the URL for it ...)
>> It seems that you have a similar problem.
>>
>> Eyal
>>
>> On Sat, Jun 7, 2008 at 11:41 PM, Martin Makundi <
>> [EMAIL PROTECTED]> wrote:
>>
>>> Hi!
>>>
>>> Did I misunderstand something? I am not a javascript-wizard ;) I could
>>> make it work perfectly with non-ajax buttons and links but it does not
>>> seem to react to wicket ajax buttons.
>>>
>>> Here is the script code, pls take a look if there is a blatant bug (I
>>> assumed I do not need to make any modifications onto the server side):
>>>
>>> <script type="text/javascript">
>>> /*
>>> * <div id="busysign">Loading ...</div>
>>> */
>>> window.onload = setupFunc;
>>>
>>> Wicket.Ajax.registerPreCallHandler(showBusysign());
>>> Wicket.Ajax.registerPostCallHandler(hideBusysign());
>>> Wicket.Ajax.registerFailureHandler(hideBusysign());
>>>
>>> function setupFunc() {
>>> document.getElementsByTagName('body')[0].onclick = clickFunc;
>>> hideBusysign();
>>> }
>>>
>>> function hideBusysign() {
>>> document.getElementById('busysign').style.display ='none';
>>> }
>>>
>>> function showBusysign() {
>>> document.getElementById('busysign').style.display ='inline';
>>> }
>>>
>>> function clickFunc(eventData) {
>>> var clickedElement = (window.event) ? event.srcElement :
>>> eventData.target;
>>> if (clickedElement.tagName == 'BUTTON' || clickedElement.tagName
>>> == 'A' || clickedElement.parentNode.tagName == 'A'
>>> || (clickedElement.tagName == 'INPUT' && (clickedElement.type ==
>>> 'BUTTON' || clickedElement.type == 'SUBMIT'))) {
>>> showBusysign();
>>> }
>>> }
>>> </script>
>>>
>>>
>>> **
>>> Martin
>>>
>>> 2008/6/7 Peter Thomas <[EMAIL PROTECTED]>:
>>> > On Sat, Jun 7, 2008 at 9:47 PM, Igor Vaynberg <[EMAIL PROTECTED]>
>>> > wrote:
>>> >
>>> >> wicket supports global javascript event handlers for this. either
>>> >> search the list or look inside wicet-ajax.js, i cant recall them off
>>> >> the top of my head.
>>> >>
>>> >
>>> > They are mentioned in this thread:
>>> >
>>> > http://www.nabble.com/Re%3A-ajax-progress-indicator-p17020185.html
>>> >
>>> >
>>> >>
>>> >> -igor
>>> >>
>>> >> On Sat, Jun 7, 2008 at 8:59 AM, Martin Makundi
>>> >> <[EMAIL PROTECTED]> wrote:
>>> >> > Hi!
>>> >> >
>>> >> > I am trying to maneuvre a lightweight gmail-style busy indicator to
>>> >> > stay in place whenever I click an operative button.
>>> >> >
>>> >> > The script seems to work fine with regular submit buttons, but I have
>>> >> > not found a proper way to reset the indicator in context with ajax
>>> >> > buttons and links.
>>> >> >
>>> >> > Is there an event I could bind this to, or do I have to push some
>>> >> > javascript from the server side / tweak the wicket-ajax.js? It would
>>> >> > be pretty nice if I could just overload/hook-to something on
>>> >> > javascript level.
>>> >> >
>>> >> > Here is my code:
>>> >> >
>>> >> > <style type="text/css">
>>> >> > #busysign {
>>> >> > display: none;
>>> >> > float: right;
>>> >> > background: red;
>>> >> > margin-top: 5px;
>>> >> > margin-right: 5px;
>>> >> > z-index: 1000;
>>> >> > width: 200;
>>> >> > font-weight: bold;
>>> >> > text-align: center;
>>> >> > font-size: 1.3em;
>>> >> > }
>>> >> > </style>
>>> >> > <script type="text/javascript">
>>> >> > window.onload = setupFunc;
>>> >> >
>>> >> > function setupFunc() {
>>> >> > document.getElementsByTagName('body')[0].onclick = clickFunc;
>>> >> > }
>>> >> >
>>> >> > function clickFunc(eventData) {
>>> >> > var clickedElement = (window.event) ? event.srcElement :
>>> >> eventData.target;
>>> >> > if (clickedElement.tagName == 'BUTTON'
>>> >> > || (clickedElement.tagName == 'INPUT' && (clickedElement.type ==
>>> >> > 'button' || clickedElement.type == 'submit'))) {
>>> >> > document.getElementById('busysign').style.display ='inline';
>>> >> > }
>>> >> > }
>>> >> > </script>
>>> >> >
>>> >> >
>>> >> > I would equally well appreciate if you had some alternative generic
>>> >> > lightweight solution :)
>>> >> >
>>> >> >
>>> >> > **
>>> >> > Martin
>>> >> >
>>> >> > ---------------------------------------------------------------------
>>> >> > To unsubscribe, e-mail: [EMAIL PROTECTED]
>>> >> > For additional commands, e-mail: [EMAIL PROTECTED]
>>> >> >
>>> >> >
>>> >>
>>> >> ---------------------------------------------------------------------
>>> >> To unsubscribe, e-mail: [EMAIL PROTECTED]
>>> >> For additional commands, e-mail: [EMAIL PROTECTED]
>>> >>
>>> >>
>>> >
>>>
>>> ---------------------------------------------------------------------
>>> To unsubscribe, e-mail: [EMAIL PROTECTED]
>>> For additional commands, e-mail: [EMAIL PROTECTED]
>>>
>>>
>>
>>
>> --
>> Eyal Golan
>> [EMAIL PROTECTED]
>>
>> Visit: http://jvdrums.sourceforge.net/
>> LinkedIn: http://www.linkedin.com/in/egolan74
>>
>
---------------------------------------------------------------------
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]
