as u can see below I am trying to change part o f my page without reload all page using ajax but I am not gettign any response
I am working on local host xampp and both files are in same directory
I also tired to palce files on host and nothing happen i did not get even an error while connecting to the database in the accdata.php file when I place them on server while there is no database
I trid a lost to change the way of ponting the url part of xmlhttp.open
like file:///C:/xml/dineshkani.xml
index.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");
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>
accdata.php
<?php
alert("Hello! php start processing");
echo "start";
$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) : " ") . "</td>";
}
echo "</tr>
";
}
echo "</table>
";
oci_free_statement($stid); // releases the statement
oci_close($conn); // closes the conneciton
?>
The ajax function is only sending a value rather than a post variable with associated value. Try along these lines - tidied it up a little but the important bit is the name=value
in the parameters send via ajax and setting the Content-Type
header often helps with stubborn xhr requests.
The javascript needn't be in the body - hence I moved that to the head section of the document.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Site Title</title>
<script>
function SendForm(){
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200){
document.getElementById("AccNum").innerHTML = xmlhttp.responseText;
}
};
xmlhttp.open( "POST", "AccData.php", true );
xmlhttp.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
xmlhttp.send( 'AccNum='+document.getElementById("AccNum").value );
}
</script>
</head>
<body>
<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>
</body>
</html>
A basic ajax function which can be re-used merely changing the parameters when it gets called.
function ajax(method,url,parameters,callback){
var xhr=new XMLHttpRequest();
xhr.onreadystatechange=function(){
if( xhr.readyState==4 && xhr.status==200 )callback.call( this, xhr.response );
};
var params=[];
for( var n in parameters )params.push( n+'='+parameters[n] );
switch( method.toLowerCase() ){
case 'post':
var p=params.join('&');
break;
case 'get':
url+='?'+params.join('&');
var p=null;
break;
}
xhr.open( method.toUpperCase(), url, true );
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
xhr.send( p );
}
function cbaccdata(r){ document.getElementById('AccNum').innerHTML=r; }
function sendForm(){
ajax.call( this, 'post','accdata.php',{ 'AccNum':document.getElementById("AccNum").value },cbaccdata );
}