How can I avoid duplicating a button request twice

Question

I press the button and call the function ... when I press the button twice

data is inserted twice

in mysql database, how can I leave it in my case ..?

This is my dynamic html:

<button type="button"
    href="javascript:;"
     class="btn btn-primary"
       onclick="jobResponse('yes',<?php echo $myjobs['id_job'];?>)"> 
         Subimt </button>

This is my function with ajax call:

 <script type="text/javascript">
    function jobResponse(res,jobId){
        var frm_data = { res : res,
            jobId : jobId
        }
        $.ajax({
            //ajax resopons and requst
        });
    }
    </script>

How can I solve this problem ..?

Answer 1

Pass the link to the button and disable it, and then when ajax finishes, enable it again if necessary.

<button type="button" href="javascript:;" class="btn btn-primary" onclick="jobResponse(this, 'yes',<?php echo $myjobs['id_job'];?>)">    Subimt</button>
<!--                                                                   ----------------^^^^----


<script type="text/javascript">
  function jobResponse(ele, res, jobId) {
    var frm_data = {
      res: res,
      jobId: jobId
    };
    // disable the button
    $(ele).prop('disabled', true);
    $.ajax({
      //ajax resopons and requst
      complete: function() {
        // enable the button if you need to
        $(ele).prop('disabled', false);
      }
    });
  }
</script>

Answer 2

you can do how to disable when the first user clicks a button as shown below.

onclick="this.disabled='true';jobResponse('yes',<?php echo $myjobs['id_job'];?>)"> 

Answer 3

,

<script type="text/javascript">

var isClicked = false;
    function jobResponse(res,jobId){
if(isClicked=== false){
       var frm_data = { res : res,
            jobId : jobId
        }
        $.ajax({
            //ajax resopons and requst
        });
       isClicked  = true;
}
    }
    </script>

Answer 4

Here you can do a simple trick. First, define a variable of type Boolean true. After clicking the first time that becomes false. Similar.

<script type="text/javascript">
var x=true;
function jobResponse(res,jobId){
    if(x){
        x=false;
        var frm_data = { res : res,
            jobId : jobId
        }         
        $.ajax({
            //ajax resopons and requst
        });
    }
}
</script>

Answer 5

Disable the button after calling the function and activate it after ajax answer

Dynamic html

<button type="button"
href="javascript:;"
 class="btn btn-primary"
 id="saveJob"
   onclick="jobResponse('yes',<?php echo $myjobs['id_job'];?>)"> 
     Subimt </button>

Ajax function

<script type="text/javascript">
   function jobResponse(res, jobId) {
   var frm_data = {
  res: res,
  jobId: jobId
};
// disable the button
$(#saveJob).prop('disabled', true);
$.ajax({
  //ajax resopons and requst
  complete: function() {
    // enable the button if you need to
    $(#saveJob).prop('disabled', false);
  }
});

}

Hope this helps you.