How to lock commit via an ajax request by a bind() event on button

Asked

Viewed 112 times

1

The ajax request, returns me "1" or "0". Every time I click the next button, but it is not blocking the commit. As I should do to validate the values, if I have a "0" answer, it should lock the commit 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’s a JSFIDDLE from the problem example

  • Good night , bicho instead of putting Return jsonData , there inside the Ajax Success , try to validate in that location, before using retur jsonData , do the check and only after the return, if it is 0 False , if true you return jsonData , see if this helps you .

  • Good evening, before returning to JSON, validate. If it is 0, return false;

  • How could you do that, post an answer so I can view your solution.

  • Give me more information on your JSON of return of the Success function inside your ajax, so I can publish an appropriate response to your problem.

  • nor is it a JSON is just "1" and "0", nothing more... In the.log (jsonData) console, it returns me "1" or "0". Only that it is not returning true or false, at the click of the button, even making the request ajax.

2 answers

0


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

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;
            }
        });

0

Then as I did not understand very well your JSON I did an example

meuPHP.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;}
                       },

                    });

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

  • I think you don’t understand the root of my problem, because it is not the return that is in trouble, suppose my PHP is the same as yours, jsonData.mensagem, would not change anything the interaction with the button event, that’s where the problem lies. even if I did it like this, I’d still be inside the Promise... you know.

  • I’ll post a similar example of the jsfiddle problem for you to understand...

  • Okay, set an example later and I’ll try to help you .

Browser other questions tagged

You are not signed in. Login or sign up in order to post.