-1

The context here is I check whether the device's location is on or off. If it is off it gives a alert dialog to go to location settings. On click of Proceed button a call back is made to the successAlert function(below code). Once it enters successAlert function there is a watcPosition called to look for change in position if at all the user has turned on location settings. If so then since location has changed the onSuccess function has to be called to display new location on map.

function successAlert(msg) { 
   alert("inside successAlert"); 
   watchId = navigator.geolocation.watchPosition(onSuccess); 
} 

This is the code. The successAlert function is called on async call back, then a watchPosition timer is started to look for change in position of the device. If at all there is change in position it should call onSuccess callback function. The callback function is called when an alert is present like in the code above else the callback is not called. What could be the reason? How to solve this?

pradeepln4
  • 131
  • 1
  • 2
  • 9
  • I assume it's not the *thread* you want to block (hint: you can't) but disable the UI until some operation completes? See https://github.com/malsup/blockui – haim770 Jul 07 '16 at 11:40
  • use sync to block the process. – Dileephell Jul 07 '16 at 11:41
  • function successAlert(msg) { **alert("inside successAlert");** watchId = navigator.geolocation.watchPosition(onSuccess); } This is the code. The successAlert function is called on async call back, then a watchPosition timer is started to look for change in position of the device. If at all there is change in position it should call onSuccess callback function. The callback function is called when an alert is present like in the code above else the callback is not called. What could be the reason? How to solve this? – pradeepln4 Jul 07 '16 at 11:44
  • 2
    What is the actual issue you need to solve? – epascarello Jul 07 '16 at 11:47
  • If I remove alert then the callback function onSuccess is not called. I dont want the alert function to be there. – pradeepln4 Jul 07 '16 at 12:00
  • @ Kaiido I have added console.log('success') in my callback function onSuccess and it does not log, on change in position of the device. – pradeepln4 Jul 07 '16 at 12:03
  • You'll need to provide a lot more context and code in order for us to helpfully answer your new question. Your **original** question is already answered. (Note: Questions on SO are not supposed to be moving targets.) – T.J. Crowder Jul 07 '16 at 12:04

2 Answers2

3

Your original question was:

How to block UI thread in javascript waiting for async function to call success or error function?

You can't, in the general case; if you try to, not only will you prevent your callback from being called, but eventually the browser will give up on your code and terminate it.

You can in some specific cases (such as when doing an ajax call), but doing so is a bad idea as it locks up the UI of at least that browser tab, making for poor UX.

The callback function is called when an alert is present like in the code above else the callback is not called. What could be the reason? How to solve this?

No, the callback will be called regardless (unless you're navigating away from the page), the only question is when. You probably want to read through How do I return the result of an asynchronous call? (spoilers: you don't, you embrace the asynchronousness).

Community
  • 1
  • 1
T.J. Crowder
  • 1,031,962
  • 187
  • 1,923
  • 1,875
  • Alternatives include, setting `disabled=true` on appropriate buttons, adding `onbeforeunload = function() {return 'Warning: saving in progress, if you leave now data may be lost!';}` and more. – Niet the Dark Absol Jul 07 '16 at 11:44
0

Try this.

function blockThread(milliseconds) {
        const start = new Date().getTime();
        for (var i = 0; i < 1e7; i++) {
          if (new Date().getTime() - start > milliseconds) {
            break;
          }
        }
      }
    ```
prometheus
  • 96
  • 1
  • 6