if Ajax request don't finish, html links can't click

Question

I have a jquery ajax request in my website page, and every page i need to post this request to server to get the status. But it have a issue: after i open the page in browser, before this request return the data, my page all link can't works, they can't click.But it render normal. so anybody have a solution for that? such as: make the page load this script after page loaded or other.

$(function(){      
      var login_status;
      $.ajax({
        async:false,
        url:<%= url(:login_status_header_session, :from => from_uri).to_json %>,
        dataType:"html",
        success:function(data, textStatus){
          login_status = data;
        }
      });
      if(login_status) {
        $(".loginDetails p .login_status").html(login_status);
      } else {
        $(".loginWrapper").remove();
      }
  });

this is the login_status_header actin:

self.headers["Cache-Control"] = "no-cache, must-revalidate"
self.headers["Expires"] = "0" partial "session_header",
:format => "html"

Answer 1

Uhm... without examining your code in too much detail, if this is supposed to occur at soon as the page is loaded, why not just put it on the server side, and generate the proper HTML in the first place? i.e. do it with PHP or whatever you're using and forget the AJAX?

Answer 2

Without more information I can only guess, and my guess is that since you're using async: false, the interface is not responding. Is there a reason for doing the request synchronously? If not try removing async:false and see if that works.

Answer 3

First, remove the async:false, line. This way the interface will keep responding while the AJAX request is being processed. Second, move your checking of the result into the success function - otherwise it runs before the request finishes, and so login_status hasn't been set yet (and thus defaults to null, which is treated as false).

$(function(){      
      var login_status;
      $.ajax({
        url:<%= url(:login_status_header_session, :from => from_uri).to_json %>,
        dataType:"html",
        success:function(data, textStatus){
          login_status = data;
          if(login_status) {
            $(".loginDetails p .login_status").html(login_status);
          } else {
            $(".loginWrapper").remove();
          }
        }
      });
  });