Note that there are some explanatory texts on larger screens.

plurals
  1. POJavascript Module Pattern and jquery Ajax wait issue
    text
    copied!<p>I have written a custom js module that basically sends messages and needs to wait for a response in order to continue:</p> <pre><code>var manageBooking = (function (jQ) { //decalre private variables var domain, msgRecieved, msgResponse, validationValue; //decalre private functions var sendMessage, wait; // A private variables domain = document.domain; msgRecieved = false; msgResponse = null; wait = function(timeOutStep){ var w; console.log('msgRecieved', msgRecieved); if (msgRecieved === true) { clearTimeout(w); return; } else { console.log('waiting..'); w = setTimeout(wait, timeOutStep, timeOutStep); } } // A private function to send messages sendMessage = function( requestURL, data, type ) { console.log(requestURL); console.log(data); console.log(type); //reset vars to defaults msgRecieved = false; msgResponse = null; jQuery.ajax({ url: "http://"+domain+"/_ajax/"+requestURL, dataType: "html", async: true, data: data, type: type, success: function(msg){ console.log(msg); msgResponse = msg; msgRecieved = true; } }); console.log('after ajax call'); wait(500); console.log('after wait'); console.log('msgRecieved', msgRecieved); return; }; return { // A public variable errorMsg: "", validationName: "", bookingID: "", output: "", // A public function to login login: function( enteredBookingID, enteredSurname ) { // Call private sendMsg sendMessage("user_login/"+enteredBookingID+"/"+enteredSurname, null, 'GET'); console.log(msgResponse); throw "error"; //check response var patt=/Sorry/i; //test pattern var result=patt.test($.trim(msgResponse)); //if false OK if (result === false) { var split = msgResponse.split('|'); validationName = split[0]; validationValue = split[1]; bookingID = enteredBookingID return true; } //else error errorMsg = msgResponse; return false; } }; })(jQuery); manageBooking.login(123,123); </code></pre> <p>The issue i am having is forcing the <code>sendMessage</code> function to wait until the ajax completes and sets <code>msgRecieved</code> to true.</p> <p>However it appears that the <code>sendMessage</code> function hits the <code>wait</code> function once and then continues. the following console output shows the order of events:</p> <pre><code>GET http://website/_ajax/user_login/123/123 after ajax call //sendMessage() msgRecieved, false //wait() waiting.. //wait() after wait //sendMessage() msgRecieved, false //sendMessage() null//login() uncaught exception: error //login() &lt;p&gt;Sorry, we cannot locate your details. &lt;/p&gt; &lt;!-- jQuery Ajax call --&gt; msgRecieved, true //wait() </code></pre> <p>What I am confused with is that the <code>wait</code> function seems to fire again right at the end.. </p> <p>can anyone give me some pointers on getting this to work?</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload