Ajax doesn't post inline table edit - php

Question

I've got a table of which I'm trying to add inline-edit to, but I'm really new to ajax. The JQuery code itself works, I can see the td's changing into input fields but I'm having trouble with posting the data.
When I click away from the table td that I'm trying to edit, it's suppose to post the data. But when I do that and refresh the page, the generated table isn't updated nor can I see changes in the database. It doesn't display an error, it only refreshes the page.
projectlist database table
projectid | Klant
4 | mike
12 | peterson
PHP
while($row = mysql_fetch_array($resultaat, MYSQL_ASSOC)){
$id = $row['projectid'];
<tr id="<?php echo $id ?>" class="tredit">
<form action="" method="post">
<td>
<span id="klant_<?php echo $id ?>" class="text"><?php echo $row["Klant"] ?></span>
<input type="text" class="ip" id="klant_ip_<?php echo $id ?>" value="<?php echo $row["Klant"] ?>">
</td>
</form>
</tr>
}
Ajax
$(document).ready(function(){
$(".tredit").click(function(){
var ID=$(this).attr('id');
$("#klant_"+ID).hide();
$("#klant_ip_"+ID).show();
}).change(function(){
var ID=$(this).attr('id');
var first=$("#klant_ip_"+ID).val();
var dataString = 'id='+ ID +'&Klant='+first;
//alert(dataString);
if(first.length > 0){
$.ajax({
type: "POST",
url: "post_table.php",
//data: dataString,
data: dataString,
cache: false,
success: function(html){
$("#klant_"+ID).html(first);
},
error: function (request, error) {
console.log(arguments);
alert(" Can't do because: " + error);
}
});
}else{
alert('Input something');
}
});
$(".ip").mouseup(function() {
return false
});
$(document).mouseup(function(){
$(".ip").hide();
$(".text").show();
});
});
post_table.php
<?php
include('config.php');
$klant = $_POST['Klant'];
$id = $_POST['id'];
$query = "update projectlist set Klant='$klant' where id='$id'";
mysql_query($query, $con);
?>
Solution
I got it working. It never ever occured to me to thoroughly check the post_table.php.
where id='$id' is wrong, it must be where projectid='$id'.

Answer 1

$(document).ready(function(){
$(".tredit").click(function(){
var ID=$(this).attr('id');
$("#klant_"+ID).hide();
$("#klant_ip_"+ID).show();
})
$(".tredit").change(function(){
var ID=$(this).attr('id');
var first=$("#klant_ip_"+ID).val();
var dataString = {"id":ID,"Klant":first};
//alert(dataString);
$("#klant_"+ID).html('<img src="load.gif" />');
if(first.length > 0){
$.ajax({
type: "POST",
url: "post_table.php",
data: dataString,
cache: false,
success: function(html){
$("#klant_"+ID).html(first);
}
});
}else{
alert('Input something');
}
});
$(".ip").mouseup(function() {
return false
});
$(document).mouseup(function(){
$(".ip").hide();
$(".text").show();
});
});
The php has to return something on the page
<?php
include('config.php');
$klant = $_POST['Klant'];
$id = $_POST['id'];
$query = "update projectlist set Klant='$klant' where id='$id'";
mysql_query($query, $con);
echo "success";
?>