jQuery Ajax send twice the second submit and three times the third submit

ajax, jquery, php

Solution

You are assigning `$('#sendbutton').click(function(){` handler inside ajax callback. It actually get's assigned new (identical) handler each time ajax callback is executed. So, upon `#sendbutton` click - multiple identical ajax requests are being executed.

Instead, delegate it once outside of ajax call:

$(document).on("click", "#sendbutton", function() {
    ...
});

Problem

I have a php file "popup_or_abbort.php" If the user have a request already, then the request will be abborted and the row in the db will be deleted with mysql_query. If I go on the page for the first time and send a request, it sends the request once. If I submit a second time it abborts the request. If I send a request again, without updating the page, it sends the request twice. Please help me to solve this problem. ``` $(document).ready(function(){ $("#request").click(function(){ uid = "<?php echo $user_id; ?>"; pid = "<?php echo $p_id; ?>"; $.ajax ({ type: "POST", url: "inc/scripts/popup_or_abbort.php", data: {"uid" : uid, "pid" : pid}, success: function(data){ if (data == "send_ok") { $('#popup').fadeIn(300); $('#sendbutton').click(function(){ pn = "<?php echo $p_name; ?>"; un = "<?php echo $username; ?>"; oid = "<?php echo $p_owner_id; ?>"; app = $('#application').val(); $.ajax({ type: "POST", url: "inc/scripts/send_team_request.php", data: {"uid" : uid, "pid" : pid, "pn" : pn, "un" : un, "oid" : oid, "app" : app}, success: function(data){ $('#request').html(data); $('#application').val(""); $('#popup').fadeOut(300); return false; } }); }); } else { $('#request').html(data); return false; } } }); return false; }); return false; }); ```

Original source