Javascript Ajax не работает

Question

мой код будет следующим

<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(); 
} 

и мой HTML код короче это

<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> 

когда я эхо $ _GET [ 'раф'] в updateCustomerDetail.php ничего не отображая ..может кто-нибудь помочь , где именно я поступил не так. Для целей тестирования я просто дал предупреждение внутри if (xmlhttp.readyState == & xmlhttp.status == 200) , но тревога не приходит

Answer 1

Ну я думаю, пост обратно является причиной issue.What вам нужно сделать, это ... Измените вход OnClick, добавив return ниже

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

И ваш Javascript код в конце добавить return false для предотвращения обратной передачи

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; 
} 

Answer 2

Просто используйте вход type='button' вместо type='submit'

Потому что отправьте заявку, если она находится в теге формы

Вы используете ajax, поэтому не нужно действие. Действие заставляет обновлять страницу.

Использование:

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

Вместо

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

Он работает. испытал меня.