Question

I am trying to add a new record in a table with the following code, using jQuery ui dialog and confirm boxes. If I double click on the confirm button the record will be added twice in the database. How can I prevent this?

function AddNewClient(){    
            jQuery("#confirmdialog").html("are you sure");
            jQuery("#confirmdialog").dialog({
                  modal: true,  
                  buttons : {
                    "Confirm" : function() {                                                                                            
                        jQuery.ajax({
                              type: "POST",                           
                              url: "index.php?option=com_travelagencycrm&view=clients&task=AddNewClient&format=raw",
                              cache: false,     
                              data : {id:jQuery("#client_id").val(),
                                      fullname:jQuery("#fullname").val(),
                                      vat_id:jQuery("#vat_id").val(),                                     
                                      address:jQuery("#address").val(),
                                      state_id:jQuery("#state_name").val(),
                                      country_id:jQuery("#country_name").val(),
                                      email:jQuery("#email").val(),
                                      phone_1:jQuery("#phone_1").val(),
                                      phone_2:jQuery("#phone_2").val(),
                                      postalcode:jQuery("#postalcode").val()                                    
                                }
                            }).done(function(msg) {         

                                jQuery("#tablepanelclients").flexReload();
                                //alert(msg);
                                jQuery("#confirmdialog").dialog("close");
                                jQuery("#editclient").dialog("close");                              

                            }).error(function(msg){
                                alert(msg);
                                jQuery("#confirmdialog").dialog("close");
                                jQuery("#editclient").dialog("close");
                            });


                    },
                    "Cancel" : function() {
                        jQuery(this).dialog("close");
                    }
                  }
                });

              jQuery("#confirmdialog").dialog("open");

        }

Answer 1

One client-side solution is to add a boolean :

var sent = false;

…

  buttons : {
                "Confirm" : function() { 
                    if (sent) return;
                    sent = true;                                                                                           
                    jQuery.ajax({

Another more robust solution would be to do server side the check that you didn’t yet insert those data. I would generally prefer this as any kind of problem or attack can happen outside the server (on the browser or the network).