javascript function synchronization

Question

I have something like this :

<html>
<script type="text/javascript">
    //BLOCK1
    function startingFunction() {
        //do a server call, receive the response through callback functions, either successFunction or failFunction

        onSuccess : successFunction,
        onFailure : failFunction
    }

    function successFunction(result) {
        //called receiving the server response
        //configure something based on success
    }

    function failFunction(result) {
        //called receiving the server response
        //configure something based on failure
    }
</script>

<script type="text/javascript">
    // BLOCK2
    //javascript code that needs to wait for the result of the configuration made above in BLOCK1 in order to continue doing more stuff
</script>

<body>...</body>
</html>

How can i make the javascript code in BLOCK2 to wait until the server has responded something and the configuration has been made?

Why not use the ol' trusty $( document ).ready(function() { ? There's a jQuery tag on this question after all — WillardSolutions
– WillardSolutions, Commented May 17, 2016 at 21:08
Do you mean from an AJAX request or when the page has fully loaded? — ste2425
– ste2425, Commented May 17, 2016 at 21:09
oops. i misspoke. Perhaps that tag should be removed. There is nothing specific to jquery in this question. — Abhishek
– Abhishek, Commented May 17, 2016 at 21:10

IrkenInvader · Accepted Answer · 2016-05-17 21:08:54Z

You can simply call a function in your second block from both functions that could be called in the first block. (assuming you want to continue after a failure)

<script type="text/javascript">
    //BLOCK1
    function startingFunction() {
        //do a server call, receive the response through callback functions, either successFunction or failFunction

        onSuccess : successFunction,
        onFailure : failFunction
    }

    function successFunction(result) {
        //called receiving the server response
        //configure something based on success
        afterConfiguration();
    }

    function failFunction(result) {
        //called receiving the server response
        //configure something based on failure
        afterConfiguration();
    }
</script>

<script type="text/javascript">
    // BLOCK2
    //javascript code that needs to wait for the result of the configuration made above in BLOCK1 in order to continue doing more stuff

    function afterConfiguration(){
      //code that needed to wait
    }

</script>

Joeri Hendrickx · Accepted Answer · 2016-05-17 21:07:31Z

1

Just place the code in block two inside a function, then invoke that function at the end of successFunction.

Then again, I don't see the point of splitting this up in two script elements.

answered May 17, 2016 at 21:07

Joeri Hendrickx

17.5k4 gold badges43 silver badges53 bronze badges

Comments

Shadi Shaaban · Accepted Answer · 2016-05-18 00:23:45Z

You could also use a flag and check periodcally using setInterval():

Using a Flag:

<html>
<script type="text/javascript">
//BLOCK1
var block1Success = false; // <-- this is our flag
function startingFunction() {
    //do a server call, receive the response through callback functions, either successFunction or failFunction

    onSuccess : successFunction,
    onFailure : failFunction
}

function successFunction(result) {
    //called receiving the server response
    //configure something based on success
    block1Success = true; // <-- flag is set here
}

function failFunction(result) {
    //called receiving the server response
    //configure something based on failure
}
</script>

<script type="text/javascript">
// BLOCK2
//javascript code that needs to wait for the result of the configuration      made above in BLOCK1 in order to continue doing more stuff
window.setInterval(
    function(){
       if(block1Success){ 
         // code need to be executed here..
         alert("block1 success executed");
       }
    }, 100)
</script>

<body>...</body>
</html>

Collectives™ on Stack Overflow

javascript function synchronization

3 Answers 3

Comments

Comments

Using a Flag:

Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Using a Flag:

Comments

Related