Updation in database using Ajax

[Shalini Bhalla]

i have 2 tables bank master and branch details having bankcode as a common feild .

i have designed a form in which i am filtering branches according to a particular bank code using ajax , i an fine till this ..... now i want that fields of these records should come in a separate field so that i can change my data there itselfe and using ajax can update database on onblur event ...... how to do this ?

this is my code for displaying information about banches having similar bank_code
[PHP]elseif($name == "select_bank_co de")
{
$sql="SELECT * FROM bankbranches WHERE bank_code = '".$q."'";
$result = mysql_query($sq l);
echo "<table width='100%'>";
$i=0;
while($row = mysql_fetch_arr ay($result))
{
$bcode = $row['bank_code'] ;
$brcode = $row['branch_code'] ;
$badd = $row['branch_address '] ;
$pin = $row['branch_address '] ;
$bc = "bank_code" ;

echo "<input name='branch_co de[$i]' type='hidden' value='$row[branch_code]'/>";
echo "<tr><td>Ba nk Code </td><td><input type='text' name='bcode[$i]' value='".$bcode ."' onblur='modufy_ rec('".$bcode." ','".$brcode."' ,this.value,'ba nk_code');'></td>";
echo "<tr><td>Br anch Code </td><td><input type='text' name='brcode[$i]' value='".$brcod e."' onblur='modufy_ rec('".$bcode." ','".$brcode."' ,this.value,'br anch_code');'></td>";
echo "<tr><td>Br anch address </td><td><input type='text' name='baddress[$i]' value='".$badd. "' onblur='modufy_ rec('".$bcode." ','".$brcode."' ,this.value,'br anch_address'); '></td>";
echo "<tr><td>Pincod e </td><td><input type='text' name='pincode[$i]' value='".$pin." ' onblur='modufy_ rec('".$bcode." ','".$brcode."' ,this.value,'pi ncode');'></td>";

$i+1;
}
echo "</table>";


}[/PHP]

Using this i am getting values displayed but onblur is not working , this fuction takes necessary fields for generating query and this is javascript function which calls PHP ultimatly

[acoder]

You seem to have mixed quotes. If you look at the generated source, you should see the problem. Also look at error messages that you may see in the error console.

[Shalini Bhalla]

I have 2 tables bank master and branch details having common fields bank_code

using Ajax i am displaying branch details of a particular bank_code in a dynamic form in texbox so that if i want to make any change i can change and save it using ajax on onblur event of textbox in which i have made changes ..

I have successfully completed till displaying values in text box , but now i want to save Changes where my ajax function is not executing....

code for displaying dynamic for is :

[PHP]elseif($name == "select_bank_co de")
{
$sql="SELECT * FROM bankbranches WHERE bank_code = '".$q."'";
$result = mysql_query($sq l);

echo "<form name='form2'><t able width='100%'>";
$i=0;
while($row = mysql_fetch_arr ay($result))
{
$bcode = $row['bank_code'] ;
$brcode = $row['branch_code'] ;
$badd = $row['branch_address '] ;
$pin = $row['pincode'] ;
$bc = "bank_code" ;
$br = "branch_cod e";
$bad = "beanch_address ";
$pc = "Pincode";

echo "<tr><input name='branch_co de[\'".$i."]\' type='hidden' value='$row[branch_code]'/>";
echo "<td>Bank Code </td><td><input type=\"text\" name=\"bcode{$i }\" value=\" {$bcode}\" onblur=\"modify _rec('{$bcode}' , '{$brcode}', this.value,'{$b c}')\" /></td>";
echo "<td>Branch Code </td><td><input type=\"text\" name=\"brcode{$ i}\" value=\" {$brcode}\" onblur=\"modify _rec('{$bcode}' , '{$brcode}', this.value,'{$b r}')\" /></td>";
echo "<td>Branch Address </td><td><input type=\"text\" name=\"badd{$i} \" value=\" {$badd}\" onblur=\"modify _rec('{$bcode}' , '{$brcode}', this.value,'{$b ad}')\" /></td>";
echo "<td>Pin</td><td><input type=\"text\" name=\"pin{$i}\ " value=\" {$badd}\" onblur=\"modify _rec('{$bcode}' , '{$brcode}', this.value,'{$p c}')\" /></td>";
$i+1;
}
echo "</table></form>";
[/PHP]


and code for Aajax is :


[HTML]<script>


function modify_rec(bcod e,brcode,val,nm )
{

var ajaxRequest; // The variable that makes Ajax possible!

try{
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest( );
} catch (e){
// Internet Explorer Browsers
try{
ajaxRequest = new ActiveXObject(" Msxml2.XMLHTTP" );
} catch (e) {
try{
ajaxRequest = new ActiveXObject(" Microsoft.XMLHT TP");
} catch (e){
// Something went wrong
alert("Your browser broke!");
return false;
}
}
}
// Create a function that will receive data sent from the server
ajaxRequest.onr eadystatechange = function(){
alert("fsdsf12" );
if(ajaxRequest. readyState == 4){
document.form2. time.value = ajaxRequest.res ponseText;
}
}
alert("fsdsf13" );
url=url+"?bcode =" + bcode + "&brcode=" + brcode + "&fnm=" + nm + "&val=" + val;
alert(url);
ajaxRequest.ope n("GET", "modify_branche s.php" + url , true);
ajaxRequest.sen d(null);
}
</script>[/HTML]


when i am calling modify_rec()

using alert i can see that values have been passed in function but when i am trying to alert url from modify_rec() nothing have been printed ....

can anbody solve the problem

[acoder]

Merged threads since it relates to the same problem (title).

Show the generated source as the HTML appears on the client-side in your browser (View Source).

[Shalini Bhalla]

i am not understanding exactly what you want to know ?

[acoder]

OK, I'll try again. Can you see this part:
[PHP]echo "<tr><input name='branch_co de[\'".$i."]\' type='hidden' value='$row[branch_code]'/>";
echo "<td>Bank Code </td><td><input type=\"text\" name=\"bcode{$i }\" value=\" {$bcode}\" onblur=\"modify _rec('{$bcode}' , '{$brcode}', this.value,'{$b c}')\" /></td>";
echo "<td>Branch Code </td><td><input type=\"text\" name=\"brcode{$ i}\" value=\" {$brcode}\" onblur=\"modify _rec('{$bcode}' , '{$brcode}', this.value,'{$b r}')\" /></td>";
echo "<td>Branch Address </td><td><input type=\"text\" name=\"badd{$i} \" value=\" {$badd}\" onblur=\"modify _rec('{$bcode}' , '{$brcode}', this.value,'{$b ad}')\" /></td>";
echo "<td>Pin</td><td><input type=\"text\" name=\"pin{$i}\ " value=\" {$badd}\" onblur=\"modify _rec('{$bcode}' , '{$brcode}', this.value,'{$p c}')\" /></td>";[/PHP] That's PHP which I can understand, but I'd rather see the HTML. If you load the page in your browser and then in the browser menu select View -> Source (or Page Source). This will show you the HTML code as rendered in the browser. Find the form/table code and post that here.

[Shalini Bhalla]

This is the code vhich i am getting after executing ajax first time

[HTML]



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>BANK BRABCH DETAILS</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="style1.cs s" rel="stylesheet " type="text/css">
<script>


var xmlHttp

function showUser(str , nm)
{


xmlHttp=GetXmlH ttpObject()
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request")
return
}
var url="get_bank_b ranch_code.php" ;
url=url+"?q="+s tr+"&name="+nm ;
url=url+"&sid=" +Math.random()
xmlHttp.onready statechange=sta teChanged
xmlHttp.open("G ET",url,true)
xmlHttp.send(nu ll)
}


function stateChanged()
{
if (xmlHttp.readyS tate==4 || xmlHttp.readySt ate=="complete" )
{
document.getEle mentById("txtHi nt").innerHTML= xmlHttp.respons eText
}
}

function GetXmlHttpObjec t()
{
var xmlHttp=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest( );
}
catch (e)
{
//Internet Explorer
try
{
xmlHttp=new ActiveXObject(" Msxml2.XMLHTTP" );
}
catch (e)
{
xmlHttp=new ActiveXObject(" Microsoft.XMLHT TP");
}
}
return xmlHttp;
}

</script>

<script>


function modify_rec(bcod e,brcode,val,nm )
{

var ajaxRequest; // The variable that makes Ajax possible!

try{
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest( );
} catch (e){
// Internet Explorer Browsers
try{
ajaxRequest = new ActiveXObject(" Msxml2.XMLHTTP" );
} catch (e) {
try{
ajaxRequest = new ActiveXObject(" Microsoft.XMLHT TP");
} catch (e){
// Something went wrong
alert("Your browser broke!");
return false;
}
}
}
// Create a function that will receive data sent from the server
ajaxRequest.onr eadystatechange = function(){
alert("fsdsf12" );
if(ajaxRequest. readyState == 4){
document.form2. time.value = ajaxRequest.res ponseText;
}
}
alert("fsdsf13" );
url=url+"?bcode =" + bcode + "&brcode=" + brcode + "&fnm=" + nm + "&val=" + val;
alert(url);
ajaxRequest.ope n("GET", "modify_branche s.php" + url , true);
ajaxRequest.sen d(null);
}
</script>

</head>

<body >
<form name="form1" >
<div align="center">
<table width="103%" border="0" align="center" cellpadding="0" cellspacing="0" class="tabborde r">
<tr>
<td colspan="4"><di v align="left">
<input type="button" name="new_rec" value="Add New Record " >
</div></td>

</tr>
<tr>
<td colspan="4">&nb sp;</td>
</tr>
<tr>
<td colspan="4" class="box">Ban k Master </td>
</tr>
<tr>

<td colspan="4"><di v align="center">
<table width="100%" border="0" cellpadding="3" cellspacing="3" >
<tr>
<td width="17%" height="30">Bra nch Code </td>
<td width="8%" height="30"><se lect name="select _bank_branch_co des" onchange="showU ser(this.value , this.name);">
<option value="" selected >Search </option>
<option value='b101'>b1 01</option><option value='b102'>b1 02</option> </select></td>

<td width="11%" height="30">Ban k Code</td>
<td width="9%" height="30"><se lect name="select_ba nk_code" class="tabborde r" id="select5" onchange="showU ser(this.value , this.name);">
<option value="" selected >Search </option>
<option value='01'>01</option><option value='02'>02</option> </select></td>
<td width="9%">Pin Code </td>
<td width="46%"><in put type="text" name="pin" onblur="showUse r(this.value , this.name);"></td>

</tr>
<tr>
<td colspan="6"><di v id="txtHint"><b >User info will be listed here.</b></div></td>
</tr>
</table>
</div></td>
</tr>
<tr>

<td colspan="2" class="box"><in put name="save_chg" type="submit" id="save_chg" value="Save Changes"></td>
<td colspan="2" class="box"><in put type="submit" name="Submit" value="Delete"> </td>
</tr>
<tr>
<td colspan="4">&nb sp;</td>
</tr>
<tr>
<td colspan="4" class="box"><di v align="left">Li st Of All Banks </div></td>

</tr>
<tr class="tabborde r">
<td width="7%" class="tabborde r"><div align="center"> S.No</div></td>
<td width="8%" class="tabborde r"><div align="center"> Bank Code</div></td>
<td width="49%" class="tabborde r"><div align="center"> Branch Code </div></td>
<td width="36%" class="tabborde r"><div align="center"> Branch Address </div></td>

</tr>
<tr class='tabborde r'><td class='tabborde r' align='center'> 1</td><td class='tabborde r' align='left'>b1 01</td><td class='tabborde r' align='left'>01 </td><td class='tabborde r' align='left'>ja nakpuri</td></tr> <tr class='tabborde r'><td class='tabborde r' align='center'> 2</td><td class='tabborde r' align='left'>b1 02</td><td class='tabborde r' align='left'>01 </td><td class='tabborde r' align='left'>Vi kaspuri</td></tr> </table>
</div>
</form>

</body>
</html>
[/HTML]

[acoder]

Ah, I see. The code will obviously be added via Ajax.

OK, so now load the requested page directly in the browser with the parameters you would pass when making the Ajax request, e.g. "get_bank_branc h_code.php?q=01 &name=select_ba nk_code" and check the source and display that here.

[Shalini Bhalla]

After requesting above url with variable what ever code i got was corrected and noe i am getting this but , values still are not getting updated


[HTML]<form name='form2'><t able width='100%'><t r><input name='branch_co de[0]' type='hidden' value='b101'/>

<td>Bank Code </td><td><input type="text" name="bcode[0]" value=" 01" onblur="modify_ rec('01', 'b101', this.value,'ban k_code')" /></td>

<td>Branch Code </td><td><input type="text" name="brcode[0]" value=" b101" onblur="modify_ rec('01', 'b101', this.value,'bra nch_code')" /></td>

<td>Branch Address </td><td><input type="text" name="badd[0]" value=" janakpuri" onblur="modify_ rec('01', 'b101', this.value,'bea nch_address')" /></td>

<td>Pin</td><td><input type="text" name="pincode[0]" value=" 110018" onblur="modify_ rec('01', 'b101', this.value,'Pin code')" /></td>


<tr><input name='branch_co de[1]' type='hidden' value='b102'/>

<td>Bank Code </td><td><input type="text" name="bcode[1]" value=" 01" onblur="modify_ rec('01', 'b102', this.value,'ban k_code')" /></td>

<td>Branch Code </td><td><input type="text" name="brcode[1]" value=" b102" onblur="modify_ rec('01', 'b102', this.value,'bra nch_code')" /></td>

<td>Branch Address </td><td><input type="text" name="badd[1]" value=" Vikaspuri" onblur="modify_ rec('01', 'b102', this.value,'bea nch_address')" /></td>

<td>Pin</td><td><input type="text" name="pincode[1]" value=" 110048" onblur="modify_ rec('01', 'b102', this.value,'Pin code')" /></td></table></form>[/HTML]

[acoder]

If you look at the values, each of them has a space before them. That's the problem. Remove the spaces and it should hopefully work.