Alright. I'm new to jEditable. Let me explain the issue i'm having with jEditable.
I have this simple table in my database -
id car make
1 panamera porsche
2 italia ferraris
3 avantador lamborghini
4 slk mercedes
And i'm gonna echo this table in a while loop and below is the code -
<script type="text/javascript">
<?php
$query2 = "SELECT * FROM inplace LIMIT 0, 6";
$result2 = mysql_query($query2) or die ('Query couldn\'t be executed');
$row2 = mysql_fetch_assoc($result2);
?>
$(function() {
$(".items").editable("handler.php", {
submitdata : {userid: "<?php echo $row2['id']; ?>"},
indicator : "<img src='img/indicator.gif'>",
tooltip : "Doubleclick to edit...",
event : "click",
onblur : "submit",
name : 'newvalue',
id : 'elementid',
});
});
</script>
</head>
<body>
<ul>
<?php
$query = "SELECT * FROM inplace LIMIT 0, 6";
$result = mysql_query($query) or die ('Query couldn\'t be executed');
while ($row = mysql_fetch_assoc($result)) {
echo '<li class="items" id="car">'.$row['car'].'</li>';
echo '<li class="items" id="make">'.$row['make'].'</li>';
}
?>
</ul>
In the above code, i'm passing newvalue(user edited) and elementid(car or make) in the jeditable script. And i also need one more identifier which helps identify the correct database id to update. So i'm trying to pass the database id in submitdata : {userid: "<?php echo $row2['id']; ?>"}. I'm not sure if that method is correct.
And below is the update query in "handler.php" file -
require("db.php");
function fail($msg) {
header('HTTP/1.0 404 Not Found');
die($msg);
}
$id = (int)@$_POST['userid'];
$field = @$_POST['elementid'];
$allowed_fields = array('car','make');
if (!in_array($field, $allowed_fields)) fail('Invalid or missing field.', 404);
$newvalue = $_POST['newvalue'];
$query = "UPDATE inplace SET `$field`='$newvalue' WHERE id=$id";
$result = mysql_query($query);
echo $newvalue;
So the issue here is, this submitdata : {userid: "<?php echo $row2['id']; ?>"} is passing only 1st id. That means its passing only one id. So even if you edit italia or avantador which belongs to ids 2 and 3 respectively, it updates 1st id. When i echo the query, whichever car you edit, it always reads as UPDATE inplace SETcar='volante' WHERE id=1. When i directly write 2 or 3 or 4 in the submitdata, it updates correctly. Its passing only one id. Someone suggested me to use like id="car-'.$row['id'].'" and then explode it and then use foo and stuff. I tried using it but didnt work for me. Looking for a solution for this.
You can make a custom attribute in your <li> tags containing the id number. Then in your jQuery, you just grab that value.
<script type="text/javascript">
$(function() {
$("li.items").each(function(index) {
$(this).editable("handler.php", {
submitdata : {userid: $(this).attr('carid')},
indicator : "<img src='img/indicator.gif'>",
tooltip : "Doubleclick to edit...",
event : "click",
onblur : "submit",
name : 'newvalue',
id : 'elementid',
});
});
});
</script>
</head>
<body>
<ul>
<?php
$query = "SELECT * FROM inplace LIMIT 0, 6";
$result = mysql_query($query) or die ('Query couldn\'t be executed');
while ($row = mysql_fetch_assoc($result)) {
echo '<li class="items" carid="'.$row['id'].'" id="car">'.$row['car'].'</li>';
echo '<li class="items" carid="'.$row['id'].'" id="make">'.$row['make'].'</li>';
}
?>
</ul>
Disclaimer: I didn't test this and i'm not 100% sure on the jQuery syntax.
[EDIT] I just changed it around to hopefully work using the $(this) selector to reference each specific <li>.