Jquery POST sending multiple variables

Question

I've been trying to figure out this issue with my website for a while now--I have a bunch of "stars" a user can click on.

clicking on a star loads a file into a div with information regarding that star. It also loads a button for the players to click and "Take over" the planet. That all is working well and fine, however--I've recently discovered an issue that I'm not quite sure how to handle.

IF a player clicks on multiple stars before reloading the page for whatever reason--when the click to attack/whatever the star--it'll send multiple requests across the server. I at first thought this was something in my coding that was sending all information regarding all the stars, however I've come to realize that it's only the stars that the player has clicked on.

Now--Here is the code:

$.ajaxSetup ({
    // Disable caching of AJAX responses
    cache: false
});
    function loadStatus()
{
        $.ajax(
        {
            url:'world1.php', error: function () { }, dataType:'json',
            success: function(data)
            {
                denial = false;
                $('#credits').html(data.credits);
                $('#fuelleft').html(data.fuel);
                $('#energyleft').html(data.energy);
            }
        }); 
}
function currentStarMapURL(URL)
{
        $('#starmap').load(URL, {},
        function()
        {
            $('#loader').hide();
            fullStarInformation(URL);
            starInformation();
            setInterval(function() { $('.unknown').effect("highlight",{color:"#800000"}, 1500)});
            return false;   
        }
        );
}

/*
    purhcase upgrades
*/
/*
    Retriever Better Star Info 
*/
function fullStarInformation()
{
    $(".star").click(
        function()
        {
            $('#planet-bar').empty();
            val = this.id;
            url = "planet.php?sid="+val;
            $('#planet-bar').load(url, {'sid':val},
                function()
                {
                    colony(url);
                }
            );
        }
        );
}
function colony(url)
{
    $('#planet-bar').on("click", "button",
    function() {
        event.preventDefault();

        name = 0;
        $(this).hide();
            name = $(this).attr('sid');
            $.post('purchase.php?mode=planet', {sid: name}, 
                function () 
                { 
                    $('#planet-bar').load(url, {}, function () { currentStarMapURL(URL2); })
                }
                );  
        $(this).prop('disabled', true); 
         });

}

I figured at first that the issue was a caching issue, so I added the $.ajaxSetup to the first line, but that didn't seem to change anything. Then I figured, maybe it's the way the code was being called--I originally had two seperate functions; one for attack, one for colonizing. both of which were being called in the fullStarInformation function, So I moved it all down to one function, i'm still getting the issue.

AFAIK, right now, i may have to rewrite this entire block of code so that the colony function and the starInformation function are separate and not acting upon one another. But I wanted to get a second, third maybe even fourth set of eyes on the code before I go about doing that.

you could try to implement jquery's promise: Doc's: google.com/search?q=jquery+promise it will help you to run anything else after or mean while the current promised action is still processing or done , also look jquery's Doc's for done api.jquery.com/deferred.done — HenryW
– HenryW, Commented Mar 10, 2014 at 18:01

dave · Accepted Answer · 2014-03-10 18:02:43Z

1

If you are getting multiple ajax calls, chances are you are setting up multiple event handlers. Just quickly glancing through the code, I would think you should change

function colony(url)
{
  $('#planet-bar').on("click", "button", function() { ... } );

To

function colony(url)
{
  $('#planet-bar').off("click", "button"); //unbind old event handlers
  $('#planet-bar').on("click", "button", function() { ... } );

answered Mar 10, 2014 at 18:02

dave

65.1k6 gold badges81 silver badges98 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user3277023 Over a year ago

Ahha! Did not know that .off even existed! not 100% sure but it seems to have fixed it! Thank you kind sir, you are a scholar and a gentleman.

Collectives™ on Stack Overflow

Jquery POST sending multiple variables

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related