Async Validation with deferred object

[zaalbarxx]

Added possibility return deferred object instead of boolean onStepChanging allowing to return jQuery deferred object like http request to allow for async check for validation.

It has backward compatibility i.e. if boolean is returned from the callback then it will work just like it did. But if the deferred object will be returned from callback the change of state will be hold until deferred object will get resolved. ie

onStepChange: function(){
    return $.get('url').done(function(response)){
        return response; // true or false
    }
}

[simono]

Thanks @zaalbarxx Sounds very useful. Let me know if I can help with anything.

[orenf]

f22dfb7

@t3chboy I modified your working sample slightly. I don't think I want to create another pull request based on code you wrote, but the changes that I made on your changes worked well for me so it might work for someone else as well.

This is how I use it:

  const save = () => {
    return $.ajax({url:  '/api/endpoint', type: 'POST', data: this.getData() })
      .done((data) => {
        debugger;
      })
      .fail((data) => {
        return false;
      });
  }

  const onStepChanging = (event, currentIndex, newIndex) => {
    $('#form-2').validate().settings.ignore = ':disabled';
    // make sure frontend validation passes
    if (!$('#form-2').valid()) {
      return false;
    }
    // Only save when we move Next, return true if clicking Previous
    if (currentIndex === 0 && newIndex > currentIndex) {
      return save();
    } else {
      return true;
    }
  };```

[adrian-e]

As far as I could see, the problem was not with the original code but with the sample provided. You should not return the jQuery post (or get) deferred directly but create a custom one and use it inside your post or get call to resolve either with true o false.
Here is a sample:

onStepChanging: function() {
  var def = $.Deferred();
  $.post({POST_SETTINGS}).done(function(response) {
     // Check response
     def.resolve(true); // or false according to the response. If true steps will go to next one otherwise will stay on the same
   })

  return def; // This is the Deferred that should be returned and NOT the one from jQuery Ajax
}

Hope this helps someone :)