title: Pause or disable the page while doing ajax call Jquery mobile
body: <p>I am doing Ajax call which goes to server and get records back. Am showing progress bar on ajax and stops when done.</p>
  
  <pre><code>// Shows the loading bar when ajax call starts
  $(document).ajaxStart(function() {
      $.mobile.loading('show');
  });
  
  // dismiss the loading bar when ajax call ends
  $(document).ajaxStop(function() {
      $.mobile.loading('hide');
  }); 
  </code></pre>
  
  <p>The progress bar shows but still I can edit the fields in the page. I don't want that to do. I want to have the page in pause state. I looked Jquery mobile API but nothing helped.</p>
  
  <p>I am disabling each and every fields in ajax starts and enabling all on ajax ends. Is this the right approach ?</p>
  
  <p>An example code snippet would help me</p>