Ответ Ajax работает после двух кликов?

Question

Я только что написал базовую систему входа в систему, где html-страница использует javascript для отправки запроса ajax сервлету, который обращается через базу данных. Вот код js

var res;
function getXMLObject()
{
   var xmlHttp = false;
   try {
     xmlHttp = new ActiveXObject("Msxml2.XMLHTTP")  // For Old Microsoft Browsers
   }
   catch (e) {
     try {
       xmlHttp = new ActiveXObject("Microsoft.XMLHTTP")  // For Microsoft IE 6.0+
     }
     catch (e2) {
       xmlHttp = false   // No Browser accepts the XMLHTTP Object then false
     }
   }
   if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {
     xmlHttp = new XMLHttpRequest();        //For Mozilla, Opera Browsers
   }
   return xmlHttp;  // Mandatory Statement returning the ajax object created
}

var xmlhttp = new getXMLObject();   //xmlhttp holds the ajax object


function handleServerResponse() {
   if (xmlhttp.readyState == 4) {        
               res=xmlhttp.responseText;
   }
     else {
                    return false;
        alert("Error during AJAX call. Please try again");
     }

}

function ajaxFunction() {
        var veid=document.getElementById("eid").value;
        var vpwd=document.getElementById("pwd").value;
        //window.alert('here inside ajaxFunction'+vconf+' '+vseid);
  if(xmlhttp) {
    xmlhttp.open("GET","check_login?eid="+ veid +"&pwd="+ vpwd,true); //this is the servlet name
    xmlhttp.onreadystatechange  = handleServerResponse;
    xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    xmlhttp.send(null);
  }
}


    function def()
    {
        //window.alert('hi');
        ajaxFunction();            
        //alert('res:'+res);
        if(res=='y')
       {               
                    return true;
       }
       else
       {
                    document.getElementById("uhidden").style.color="#CC0000";
                    document.getElementById("uhidden").innerHTML="Invalid E-Mail ID or Password"
                    return false;                        
       }
    }

Но код работает только после двух кликов :( Любая помощь, ребята?

Answer 1

Ваша def функция вызывает ajaxFunction, а затем сразу проверяет переменную res. Однако ajaxFunction просто отправляет запрос AJAX; он не ожидает ответа AJAX. Ваш код проверяет переменную res перед ее установкой из ответа AJAX.

Вот почему он работает при втором щелчке - не потому, что переменная res задается ответом AJAX второго щелчка, а потому, что он все еще устанавливается из ответа AJAX первого щелчка.

Решение состоит в том, чтобы немного перестроить ваш код. Переместите код, чтобы отобразить недопустимое сообщение для входа в систему, где получен ответ AJAX. Другими словами, замените строку res=xmlhttp.responseText; некоторым кодом, чтобы проверить, не является ли xmlhttp.responseText значение y, и отобразите неверное сообщение для входа.

Answer 2

Полагаю, вы вызываете def ()

Ваш запрос является асинхронным (поскольку для третьего аргумента open () установлено true ), но в def () вы сразу после отправки запроса работаете с результатом:

ajaxFunction();            
//alert('res:'+res);
if(res=='y')

В настоящее время запрос обычно не завершен, результат еще не доступен

Поместите весь код, который должен работать с ответом сервера, в handleServerResponse ()