2016-08-13 144 views
0

我試圖改變使用AJAX我的PHP網頁如下 內容index.php頁面已輸入申請的是調用函數按鈕上點擊執行,但我的問題是,頁面重新加載是它使用ajax更新php頁面使用post請求重新加載頁面?

所以我想知道我在做什麼錯?

請注意,我現在用的是POST請求,以保持我的數據安全,因爲w3schools.com推薦

inexd.php下面

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="UTF-8"> 
<title>Site Title</title> 

</head> 

<body align="left"> 

<div> 
    <h4 align="left">Balance Enquiry</h4> 
</div> 

<form> 
    <div> 
     <label>Account Number </label> 
     <input id="AccNum" type="text" name="AccNumInput"> 
     <button type="button" onclick="SendForm()">Search</button> 
     </div> 
</form> 

<script> 
function SendForm() 
{ 
    alert("Hello! SendForm start"); 
     var xmlhttp = new XMLHttpRequest(); 
     xmlhttp.onreadystatechange = function() 
    { 
      if (xmlhttp.readyState == 4 && xmlhttp.status == 200) 
      { 

       document.getElementById("AccNum").innerHTML = xmlhttp.responseText; 
      } 
    }; 
     alert("Hello! going to send ajax"); 
     var x = xmlhttp.open("POST","AccData.php", true); 
     xmlhttp.send(document.getElementById("AccNum").value); // you want to pass the Value so u need the .value at the end!!! 

     alert(document.getElementById("AccNum").value); 
     alert("Hello! SendForm end"); 
} 
</script> 

</body> 

</html> 

data.php文件代碼文件代碼

<?php 

alert("Hello! php start processing"); 

$AccountNumber = $_POST['AccNum']; 

$conn = oci_connect('admin', 'admin', 'localhost/JDT', 'AL32UTF8'); 
if (!$conn) { 
    $e = oci_error(); 
    trigger_error(htmlentities($e['message'], ENT_QUOTES), E_USER_ERROR); 
} 

alert("Hello! connected to oracle"); 

$sqlstr = 'SELECT CUSTOMER_ID,CUST_NAME,PHONE1 FROM customers where CUSTOMER_ID=:AccNum'; 

$stid = oci_parse($conn, $sqlstr); // creates the statement 

oci_bind_by_name($stid, ':AccNum', $AccountNumber); // binds the parameter 

oci_execute($stid); // executes the query 

echo $AccountNumber; 
/** 
* THIS WHILE LOOP CREATES ALL OF YOUR HTML (its no good solution to echo data out like this) 
*/ 
while ($row = oci_fetch_array($stid, OCI_ASSOC + OCI_RETURN_NULLS)) { 
    echo "<tr>"; 
    foreach ($row as $item) { 
     echo "<td align=center>" . ($item !== null ? htmlentities($item, ENT_QUOTES) : "&nbsp;") . "</td>"; 
    } 
    echo "</tr>\n"; 
} 
echo "</table>\n"; 

oci_free_statement($stid); // releases the statement 
oci_close($conn); // closes the conneciton 

?> 

回答

1

隨着<input type="submit" value="Search">您的形式發送「舊」與Ajax無關的服務器方式!

<form> 
    <div> 
     <label>Account Number </label> 
     <input id="AccNum" type="text" name="AccNuminput"> 
     <button type="button" onclick="sendForm()">Search</button> 
     </div> 
</form> 
<script> 
function sendForm(){ 
    var xmlhttp = new XMLHttpRequest(); 
    xmlhttp.onreadystatechange = function() { 
      if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
       //Execudted when finished and everything its Okay 
       document.getElementById("AccNum").innerHTML = xmlhttp.responseText; 
      } 
     }; 
     xmlhttp.open("POST", "acc_data.php", true); 
     xmlhttp.send("accNum="+document.getElementById("AccNum").value); // you want to pass the Value so u need the .value at the end!!! 
    } 


</script> 

然後在你的data.php你不需要任何HTML你只需要處理您通過ajax的POST請求(也沒有必要爲會議)接收到的數據。在xmlhttp.responseText中,您在請求完成時從服務器接收到您的答案。

<?php 

$accountNumber = $_POST['accNum'];// set a good variable name 
$conn = oci_connect('admin', 'admin', 'localhost/JDT', 'AL32UTF8'); //setup connection 
if (!$conn) { 
    $e = oci_error(); 
    trigger_error(htmlentities($e['message'], ENT_QUOTES), E_USER_ERROR); // throws an error on connection error 
} 
$sqlstr = 'SELECT CUSTOMER_ID,CUST_NAME,PHONE1 FROM customers where CUSTOMER_ID=:ACCNUM'; // sql stirng 
$stid = oci_parse($conn, $sqlstr); // creates the statement 
oci_bind_by_name($stid, ':ACCNUM', $accountNumber); // binds the parameter 
oci_execute($stid); // executes the query 


/** 
* THIS WHILE LOOP CREATES ALL OF YOUR HTML (its no good solution to echo data out like this) 
*/ 
while ($row = oci_fetch_array($stid, OCI_ASSOC + OCI_RETURN_NULLS)) { 
    echo "<tr>"; 
    foreach ($row as $item) { 
     echo "<td align=center>" . ($item !== null ? htmlentities($item, ENT_QUOTES) : "&nbsp;") . "</td>"; 
    } 
    echo "</tr>\n"; 
} 
echo "</table>\n"; 

oci_free_statement($stid); // releases the statement 
oci_close($conn); // closes the conneciton 

?> 
+0

非常感謝您的善意幫助..這解釋了很多人認爲我不清楚...請你介意教我什麼更好地使用,而不是循環創建HTML? – samer

+0

歡迎 我認爲最好的解決方案是創建一個JSON對象並將json對象返回到html頁面,然後用javascript做其餘的事情...但是一步一步地......不要試圖學習所有的技術同時這真的很難。 –

+0

好吧然後生病就像你說的一步一步走..最後認爲數據沒有從服務器回來的url更改爲http:// localhost/test /?AccNumInput = 1000,但結果不會加載和在xmlhttp.send (「accNum =」+ document.getElementById(「AccNum」)value) 應該是xmlhttp.send(document.getElementById(「AccNum」).value),因爲該值將傳遞給字符串,該字符串不應該在sql語句? 'xmlhttp.open(「POST」,「acc_data.php」,true)中的 – samer

相關問題