How to lock submission through an ajax request by a bind () button event

Question

How to lock submission through an ajax request by a bind () button event

Navigation

#1 by (0 votes)
#2 by (0 votes)

1

The ajax request, returns me "1" or "0". Every time I click the forward button, however, it is not blocking the submission. How do I validate the values, if I have a "0" answer, it should block the submission method:

DDWFrontEnd = function() {

    self.checkUsedTimeSlot = function() {

    var ddw_order_date = self.$ddw_order_date.val();
    var retorno = false;
        if (self.timeSlotId != null) {
           var promise = $.ajax({
                       type: 'POST',
                       url: 'ajax.php?rand=' + new Date().getTime(),
                       async: false,
                       cache: false,
                       data : {
                           ddw_order_date: ddw_order_date,
                           id_timeslot: self.timeSlotId
                       },
                       dataType : "json",
                       complete: function(d) {

                       },
                       success: function(jsonData) {
                          return jsonData;
                       },

                    });
           return promise;
        }
    }

    $('input.avancar').bind('click', function(e) {

         var bool = self.checkUsedTimeSlot().then(
           function(returnBool) {
              return (returnBool == '1');
         });

        if (!bool) {
            e.preventDefault();
            return false;
        }
           return true;
    });

}

$(function() {
     ddw = new DDWFrontEnd();
});

Here is a problem example JSFIDDLE

php javascript jquery ajax post

asked by anonymous 17.06.2016 / 00:13

2 answers

0

So as I did not quite understand your JSON I made an example

myPHP.php would look like this:

$bonito = "SIM";
$meuJson = Array('mensagem'=>'');

if($bonito == "SIM"){
    $meuJson['mensagem'] = 1;
}else{
    $meuJson['mensagem'] = 0;
}

echo json_encode($urls);

My JS would look like this:

var promise = $.ajax({
     type: 'POST',
     url: 'ajax.php?rand=' + new Date().getTime(),
     async: false,
     cache: false,
     data : {ddw_order_date: ddw_order_date,id_timeslot: self.timeSlotId},
     dataType : "json",
     success: function(jsonData) {
            if(!jsonData.mensagem || jsonData.mensagem == 0){
                return false;
            }else{return jsonData;}
     },
     complete: function(d) {

     },

});

In your case the following happens:

var promise = $.ajax({
                       type: 'POST',
                       url: 'ajax.php?rand=' + new Date().getTime(),
                       async: false,
                       cache: false,
                       data : {
                           ddw_order_date: ddw_order_date,
                           id_timeslot: self.timeSlotId
                       },
                       dataType : "json",
                       complete: function(d) {

                       },
                       success: function(jsonData) {
                          if(!jsonData || jsonData == 0){
                             return false;
                          }else{return jsonData;}
                       },

                    });

Not knowing how to be your JSON I can not be sure but what I can say is that following my example you will achieve, good studies. If the return false does not lock use the e.preventDefault (); logically passing the event.

17.06.2016 / 16:01

How to compare user-entered strings with strings already saved in a .txt .htacess Configuration - Dynamic Error Page

score 0 · Accepted Answer

The problem is that the value that was coming from the log console was: ' "1"' or ' "0"' . So I solved the problem in the following way:

self.checkUsedTimeSlot = function() {

         var ddw_order_date = self.$input_ddw_order_date.val();

       if (self.timeSlotId != null) {
           return $.ajax({
                   type: 'GET',
                   url: 'ajax.php?rand=' + new Date().getTime(),
                   async: false,
                   cache: false,
                   data : {
                       ddw_order_date: ddw_order_date,
                       id_timeslot: self.timeSlotId
                   }
          });
       }
}

Here on the button:

      $('input.avancar').bind("click",  function (e) {
            var promise =   self.checkUsedTimeSlot()
                                .responseText
                                .replace(/\s/gi,'');
            if(promise != undefined) {
                var pr = eval(promise);
                pr = (pr == 1); 
            }
            if(!pr) {
               e.preventDefault();
               return false;
            } else {
              return true;
            }
        });