javascript ajax无法正常工作

my code is follows

<script type="text/javascript">

function saveack()
{

  var raf=document.getElementById('find_raf').value;
  var phone=document.getElementById('update_phone').value;  
  var xmlhttp;
  if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
  }
  else
  {// code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.onreadystatechange=function()
  {

     document.getElementById("res").innerHTML="<img  src='../images/ajax-loader-2.gif' />";
     if (xmlhttp.readyState==4 && xmlhttp.status==200)
     {
       alert("asd");
       document.getElementById("res").innerHTML=xmlhttp.responseText;
     }
  }
  xmlhttp.open("get","updateCustomerDetail.php?raf="+raf+"&phone="+phone,true);
  xmlhttp.send();
}

and my html code in short is

<form method="post" >
 <tr>
    <td align="right" width="50%"  bgcolor="#9FCAE9" style="font-weight:800; font-size:14px; color:#006;">RAF No.</td>
    <td width="50%" align="left" bgcolor="#E8F8FF" style="color:#006"><input type="text" style="border:none" name="find_raf" id="find_raf" onBlur="fetchDetails();" /><span id="result_raf"></span></td>
  </tr>
<tr>
    <td align="right"  bgcolor="#9FCAE9" style="font-weight:800; font-size:14px; color:#006;">Customer Phone</td>
    <td align="left" bgcolor="#E8F8FF" style="color:#006"><input type="text" style="border:none" size="30" name="update_phone" id="update_phone" /></td>
  </tr>
    <tr align="center">
        <td colspan="2"bgcolor="#E8F8FF" style="color:#006"> <input type="submit" name="update_raf" id="update_raf" value="update" onClick="saveack();" /><?=$success ?></td>
      </tr>
      <tr align="center">
      <td><div id="res"></div></td>
      </tr>
</form>

when i echo $_GET['raf'] in updateCustomerDetail.php nothing is displaying..can anyone help where exactly i have gone wrong..for testing purpose i just gave alert inside if (xmlhttp.readyState==4 && xmlhttp.status==200) but alert is not coming

Well i guess the post back is causing the issue.What you need to do is... Modify your input onclick by adding a return as below

<input type="submit" name="update_raf" id="update_raf" value="update" onClick="return saveack();" />

And in your javascript code at the end add a return false to prevent the postback

    function saveack() {
        var raf = document.getElementById('find_raf').value;
        var phone = document.getElementById('update_phone').value;
        var xmlhttp;
        if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp = new XMLHttpRequest();
        } else { // code for IE6, IE5
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange = function () {

                document.getElementById("res").innerHTML = "<img  src='../images/ajax-loader-2.gif' />";
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                        alert("asd");
                        document.getElementById("res").innerHTML = xmlhttp.responseText;
                }
        }
        xmlhttp.open("get", "updateCustomerDetail.php?raf=" + raf + "&phone=" + phone, true);
        xmlhttp.send();
        return false;
}

Just use input type='button' instead of type='submit'

Because submit make an action if it is in a form tag

You are using ajax so no need action. Action makes the page refresh.

Use:

<input type="button" name="update_raf" id="update_raf"........

Instead of

<input type="submit" name="update_raf" id="update_raf"........

It is working. tested by me.