Reply
JQuery - Load on one click?
Old 11-22-2008, 09:11 AM JQuery - Load on one click?
Galaxian's Avatar
Dingleberry!

Posts: 728
Name: Rich
Location: United Kingdom
Trades: 0
This is suseptible to click spam, and loads multiple times when clicked. How'd I make it so it loads only once when it's loading in progress and is clicked multiple times?

Code:
loadingimg = '<img src="images/loading.gif" alt="Loading.." style="margin:auto;display:block;padding:15px;" />';
$(document).ready(function(){
    $('#rstory').html(loadingimg).load('ajax/randomstory.php', function() {
        $('#rstory').fadeIn('fast')
    });
    $('#getrstory').click(function() {
    $('#rstory').fadeOut('fast', function() {
        $('#rstoryload').html(loadingimg)
        $('#rstory').load('ajax/randomstory.php', function() {
        $('#rstoryload').html('');
        $('#rstory').fadeIn('fast');
        });
        });
    });
    
});
Galaxian is offline
Reply With Quote
View Public Profile Visit Galaxian's homepage!
 
 
When You Register, These Ads Go Away!
Old 11-22-2008, 10:41 AM Re: JQuery - Load on one click?
wayfarer07's Avatar
NYE-KEE

Posts: 3,155
Name: Abel Mohler
Location: Asheville, North Carolina USA
Trades: 0
If I understand you correctly:

Make a variable called "loading" that is set to false, but is made true on click, but made false again in the callback. Then, in the click event, only make the AJAX call and fadeOut() if !loading:

Code:
loadingimg = '<img src="images/loading.gif" alt="Loading.." style="margin:auto;display:block;padding:15px;" />';
$(document).ready(function(){
var loading=false;
    $('#rstory').html(loadingimg).load('ajax/randomstory.php', function() {
        $('#rstory').fadeIn('fast')
    });
    $('#getrstory').click(function() {
    if(!loading) {
    loading=true;
    $('#rstory').fadeOut('fast', function() {
        $('#rstoryload').html(loadingimg)
        $('#rstory').load('ajax/randomstory.php', function() {
        loading=false;
        $('#rstoryload').html('');
        $('#rstory').fadeIn('fast');
        });
        });
    }
    });
});
__________________
Wayfarer | jQuery Tooltip Plugin | Mapbox: the jQuery Map
Freelance Jobs Available
If Google is the Coca-Cola of Web search, Bing is RC Cola
wayfarer07 is online now
Reply With Quote
View Public Profile Visit wayfarer07's homepage!
 
Old 11-22-2008, 01:02 PM Re: JQuery - Load on one click?
Galaxian's Avatar
Dingleberry!

Posts: 728
Name: Rich
Location: United Kingdom
Trades: 0
Thanks, finished working solution is:

Code:
loadingimg = '<img src="images/loading.gif" alt="Loading.." style="margin:auto;display:block;padding:15px;" />';
$(document).ready(function(){
var loading=false;
    $('#rstory').html(loadingimg).load('ajax/randomstory.php', function() {
        $('#rstory').fadeIn('fast')
    });
    $('#getrstory').click(function() {
    if(!loading) {
    loading=true;
    $('#rstory').fadeOut('fast', function() {
        $('#rstoryload').html(loadingimg)
        $('#rstory').load('ajax/randomstory.php', function() {
        $('#rstoryload').html('');
        $('#rstory').fadeIn('fast');
        loading=false;
        });
        });
    }
    });    
});
loading=false needs to go further down than your posted one

Thanks!
Galaxian is offline
Reply With Quote
View Public Profile Visit Galaxian's homepage!
 
Old 11-22-2008, 02:32 PM Re: JQuery - Load on one click?
wayfarer07's Avatar
NYE-KEE

Posts: 3,155
Name: Abel Mohler
Location: Asheville, North Carolina USA
Trades: 0
Right on. I'm glad you figured it out. I use this type of technique a lot when I'm doing loading sequences that use events to trigger them.
__________________
Wayfarer | jQuery Tooltip Plugin | Mapbox: the jQuery Map
Freelance Jobs Available
If Google is the Coca-Cola of Web search, Bing is RC Cola
wayfarer07 is online now
Reply With Quote
View Public Profile Visit wayfarer07's homepage!
 
Reply     « Reply to JQuery - Load on one click?
 

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are Off
Pingbacks are Off
Refbacks are Off





   
RSS Feed  Feeds: RSS   JS   XML
RSS Feed  Feeds for this forum: RSS   JS   XML

 



Page generated in 0.12585 seconds with 13 queries