0
I never post here at the P2L forums, but am a regular visitor to the site and enjoy many of the tutorials that get put up, I learn a lot from them! Today I was looking around the forum for AJAX related matters, and saw that their was some quite helpful resources and people willing to help, so I hope my little problem can be resolved and hope you're not the type who laugh in the face of people who aren't regulars, lol.
So here's my query:
I am using AJAX to edit a field in one of my database tables via a input box and using the onBlur attribute. This will sound odd, but that part I have managed to do and it works great!! to give you an insight, here is my code:
AJAX:
function editForm() {
ajax.open('GET', 'edit_form.php?name='+document.getElementById('name').value);
ajax.onreadystatechange = function() {
if(ajax.readyState == 4 && ajax.status == 200) {
document.getElementById("editInput").innerHTML = ajax.responseText;
}
};
ajax.send(null);
}
My index.php:
<?php
include('../include/functions.php');
connect();
$query = mysql_query("SELECT * FROM applications");
$row = mysql_fetch_array($query);
echo('
<div id="editInput">
<input type="text" id="name" value="'.$row['display_name'].'" onblur="editForm(); return false" /><br /><br />
</div>
');
mysql_close();
?>
Edit_form.php:
<?php
error_reporting(E_ALL ^ E_NOTICE);
include('../include/functions.php');
connect();
if($_GET['name']) {
mysql_query("UPDATE applications SET display_name = '".$_GET['name']."'");
echo($_GET['name']);
}
mysql_close();
?>
So all that works, after I re-type into the input and cause an onBlue event to happen, the input will change from an input box to the value of that database row.
What I want is to be able to do this more than once, with multiple inputs on the same page, I had a go, but whenever the onBlue event occurred, nothing happened, it stayed as a input box and didn't update the database.
Here is the code I used:
AJAX:
function editForm() {
ajax.open('GET', 'edit_form.php?name='+document.getElementById('name').value+'&username='+document.getElementById('user').value);
ajax.onreadystatechange = function() {
if(ajax.readyState == 4 && ajax.status == 200) {
document.getElementById("editInput").innerHTML = ajax.responseText;
}
};
ajax.send(null);
}
The difference is here that I added +'&username='+document.getElementById('user').value to the open() function
Index.php:
<?php
include('../include/functions.php');
connect();
$query = mysql_query("SELECT * FROM applications");
$row = mysql_fetch_array($query);
echo('
<div id="editInput">
<input type="text" id="name" value="'.$row['display_name'].'" onblur="editForm(); return false" /><br /><br />
</div>
<div id="editInput">
<input type="text" id="user" value="'.$row['username'].'" onblur="editForm(); return false" />
</div>
');
mysql_close();
?>
The difference here is I added another 'editInput' handler and another input box with a different ID and value from the DB.
Edit_form.php:
<?php
error_reporting(E_ALL ^ E_NOTICE);
include('../include/functions.php');
connect();
if($_GET['name']) {
if(mysql_query("UPDATE applications SET display_name = '".$_GET['name']."'")) {
echo(''.$_GET['name'].'<br />');
}
}
else {
if($_GET['username']) {
if(mysql_query("UPDATE applications SET username = '".$_GET['username']."'")) {
echo($_GET['username']);
}
}
}
mysql_close();
?>
The difference here is I added an 'else' statement and another 'if' function but with the $_GET as 'username' and setting the MySQL query to set another field in the table.
So I hope I have given enough info about what my problem is and I hope somebody can help me out, I would appreciate it so much.
Thanks for taking the time to read and look forward to hearing from you!
Chris.
