按钮调用ajax函数多个

Question

Quick notes. I am not using jQuery so don't suggest it.

When pressing the button which has the onclick="ajaxfunction();" i get an alert saying "Error during AJAX call. Please try again " and then I get the alert saying success, twice :S ... Why is this happening?

I don't understand why this is happening, as it calls the error, and then goes to the other part of the if statement...

Thanks in advance!

<script>

    function getXMLObject()  //XML OBJECT
    {
       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
    var url="insertProduct.php";

    function ajaxFunction() {
      var getdate = new Date();  //Used to prevent caching during ajax call
      if(xmlhttp) {
        var name = document.getElementById("name");
        var code = document.getElementById("code");
        xmlhttp.open("POST",url,true); //calling insertProduct.php using POST method
        xmlhttp.onreadystatechange  = handleServerResponse;
        xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        xmlhttp.send("name=" + encodeURIComponent(name.value) + "&code=" + encodeURIComponent(code.value)); //Posting to PHP File

      }
    }

    function handleServerResponse() {
       if (xmlhttp.readyState == 4 || xmlhttp.readyState=="complete") {
           alert("Success");
           document.getElementById("message").innerHTML=xmlhttp.responseText; //Update the HTML Form element 
       }
       else {
            alert("Error during AJAX call. Please try again " + xmlhttp.status);
       }
    }
</script>

Answer 1

After finishing the task you can call return;

Likes below.

function handleServerResponse() {
       if (xmlhttp.readyState == 4 || xmlhttp.readyState=="complete") {
           alert("Success");
           document.getElementById("message").innerHTML=xmlhttp.responseText; 
           return; 
       }
       else {
            alert("Error during AJAX call. Please try again " + xmlhttp.status);
            return;
       }
    }

I hope this will help to you.