Skip to content
This repository has been archived by the owner on Oct 8, 2021. It is now read-only.

$.mobile.changePage with safeguards #2407

Closed
mdhari opened this issue Sep 9, 2011 · 2 comments
Closed

$.mobile.changePage with safeguards #2407

mdhari opened this issue Sep 9, 2011 · 2 comments

Comments

@mdhari
Copy link

mdhari commented Sep 9, 2011

Hi,

I was wondering if there are plans on the roadmap to add some "safeguards" to this method since there will be users that change their mind and click on another item before a previous ajax call returns.

What's happening now is that multiple taps bound to $.mobile.changePage aren't aborting the current ajax request. They are simply being queued up and hence, every transition to a new page will include another ajax call from a previously queued item.

It would be nice if $.mobile.changePage can return an ajax object (XHR) so I can abort it on another tap.

And a callBack property would be nice too since I can technically disable all clickable objects and re-enable on ajax fail as well.

Note: This can be reproduced on jquery mobile demos as well. (Just go tap crazy on the list items :))

~Michael

@mdhari
Copy link
Author

mdhari commented Sep 26, 2011

Note that Kin might of solved this with Issue #2503

If there are pagebeforeload, pageload, and pageloadfailed event handlers now, I can do the following:

        <style>
            #multiclickcatcher {
                z-index: 10000;
                position:fixed; 
                top:0px;
                left:0px;
                width:100%;
                height:100%;
                text-align:center;
                vertical-align:middle;
            }
        </style>

        <div id="multiclickcatcher" style="display: none;"></div>

        <script type="text/javascript">

            $('#multiclickcatcher').bind("click",function(){
                console.log('caught');
            });

            $(document).bind( "pagebeforeload", function() {
                // Do what you want.
                $('#multiclickcatcher').css("display","block");
            });

            $(document).bind( "pageloadfailed", function( event, data ) {
                // Do what you want.
                $('#multiclickcatcher').css("display","none");
                data.deferred.reject();
            });
        </script>

This would safely intercept all clicks and ignore them so the AJAX queueing doesn't occur. On success, the multiclickcatcher gets reset with display=none.

Of course, more elegant solutions are always appreciated.

@toddparker
Copy link
Contributor

Thanks, added to the feature request wiki:
https://github.com/jquery/jquery-mobile/wiki/Feature-Requests

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

2 participants