How can I control the move to next step according to the result of some ajax call?? the data.d returns with a bool value
$("#wizard").steps({ onStepChanging: function (event, currentIndex, newIndex) { var move = false; if (currentIndex == 2) { move = false; $.ajax({ type: 'POST', url: "Reservation.aspx/SomeFunction", data: serializeData({ }), contentType: "application/json", dataType: 'json', success: function (data) { move = data.d; return true; }, error: ajaxLoadError }); } return move; }, saveState: true }); 6 Answers
Answers 1
$.ajax({ type: 'POST', url: "Reservation.aspx/SomeFunction", async: false, contentType: "application/json", dataType: 'json', success: function (data) { move = data.d; return true; }, error: ajaxLoadError }); Answers 2
you can use Samy's approach with synchronous ajax request
$("#wizard").steps({ onStepChanging: function (event, currentIndex, newIndex) { if (currentIndex == 2) { var requestResult = $.ajax({ type: 'POST', url: "Reservation.aspx/SomeFunction", async: false, contentType: "application/json", dataType: 'json', error: ajaxLoadError }); return requestResult.responseJSON.Result == "/*your expected value*/" } }, saveState: true }); Answers 3
If you don't want the $.ajax() function to return immediately, set the async option to false:
Set Timeout for Ajax if server not responding of your ajax call then it will move on next process.
$("#wizard").steps({ onStepChanging: function (event, currentIndex, newIndex) { var move = false; if (currentIndex == 2) { move = false; $.ajax({ type: 'POST', url: "Reservation.aspx/SomeFunction", data: serializeData({ }), contentType: "application/json", dataType: 'json', async: false, cache: false, timeout: 30000, success: function (data) { move = data.d; return true; }, error: ajaxLoadError }); } return move; }, saveState: true }); Answers 4
$("#wizard").steps({ onStepChanging: function (event, currentIndex, newIndex) { var $out= false; if (currentIndex == 2) { $out= false; $.ajax({ type: 'POST', url: "Reservation.aspx/SomeFunction", data: serializeData({ }), contentType: "application/json", dataType: 'json', success: function (data) { move = data.d; $out = true; }, error: ajaxLoadError }); } return $out; }, saveState: true }); Put global variable $out!
Answers 5
I encountered a similar problem, but i was using parsleyjs for validation. You might get an idea in my code.
My code is like this:
onStepChanging: function (event, currentIndex, newIndex) { // ======== Code that fails //var step = $wizard_advanced.find('.body.current').attr('data-step'), //$current_step = $('.body[data-step=\"'+ step +'\"]'); // check input fields for errors //$current_step.find('[data-parsley-id]').each(function() { //this adds .md-input-danger to inputs if invalid //there is remote validation occurring here via ajax // async: false //$(this).parsley().validate(); //}); // this is executed before ajax validation is finished //return $current_step.find('.md-input-danger').length ? false : true; // ======== END of Code that fails // FIX // waits on ajax validation to finish before returning if( $wizard_advanced_form.parsley().validate() ) { return true; } else { return false; } //FIX } Answers 6
var items; $("#wizard").steps({ onStepChanging: function (event, currentIndex, newIndex) { var move = false; if (currentIndex == 2) { move = false; items = $.ajax({ type: 'POST', url: "Reservation.aspx/SomeFunction", data: serializeData({ }), contentType: "application/json", dataType: 'json', success: function (data) { move = data.d; return true; }, error: ajaxLoadError }); } return move; }, saveState: true }); items.success(function (data) { //if can log in go to logged in page if (data.success == true) { alert("Working"); var move = data.d; return true; } else { alert("didnt work"); } // output of data alert(JSON.stringify(data)); }); 
0 comments:
Post a Comment