I am working on a website database system that I am able to edit each of the content listed in the table inline. I just click on it, type to add new data, and then clicking off of it saves the new data to the database. I am able to click on each one of the entries, and begin to type, but it does not save the updated information. I feel like it has an easy solution, but I haven't been able to find it. I have been looking over it for sometime now and cannot seem to figure it out. Any help is much appreciated..
index.php
<?php
include 'db.inc.php';
$sql= "SELECT * FROM crosswalk";
$query = $db->prepare($sql);
$query->execute();
?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
function activate (element) {
// alert('clicked')
}
function updateValue(element, column, id){
var value = element.innerText
$.ajax({
url:'backend.php',
type: 'post',
data:{
value: value,
column: column,
id: id
},
success:function(php_result){
console.log(php_result);
}
})
}
</script>
<table>
<th>Category</th>
<th>Product Category</th>
<th>NIGP</th>
<th>NIGP Short Description</th>
<th>NIGP Full Description</th>
<th>P-Group</th>
<th>Category Specialist</th>
<th>GL Unit Price < $500</th>
<th>GL Unit Price < $500 - $4,999</th>
<th>GL Unit Price - $5000 +</th>
<?php
while($row = $query->fetch()){
$c = $row['Category'];
$p = $row['Product Category'];
$n = $row['NIGP'];
$s = $row['NIGP Short Description'];
$f = $row['NIGP Full Description'];
$g = $row['P-Group'];
$gl1 = $row['GL Unit Price<$500'];
$gl2 = $row['GL Unit Price<$500-$4,999'];
$gl3 = $row['GL Unit Price-$5000+'];
$id = md5($row['id']);
?>
<tr>
<td><div contenteditable="true" onBlur="updateValue(this, 'Category','<?php echo $id; ?>')" onClick="activate(this)"><?php echo $c; ?></div></td>
<td><div contenteditable="true" onBlur="updateValue(this, 'Product Category','<?php echo $id; ?>')" onClick="activate(this)"><?php echo $p; ?></div></td>
<td><div contenteditable="true" onBlur="updateValue(this, 'NIGP','<?php echo $id; ?>')" onClick="activate(this)"><?php echo $n; ?></div></td>
<td><div contenteditable="true" onBlur="updateValue(this, 'NIGP Short Description','<?php echo $id; ?>')" onClick="activate(this)"><?php echo $s; ?></div></td>
<td><div contenteditable="true" onBlur="updateValue(this, 'NIGP Full Description','<?php echo $id; ?>')" onClick="activate(this)"><?php echo $f; ?></div></td>
<td><div contenteditable="true" onBlur="updateValue(this, 'P-Group','<?php echo $id; ?>')" onClick="activate(this)"><?php echo $g; ?></div></td>
<td><div contenteditable="true" onBlur="updateValue(this, 'GL Unit Price<$500','<?php echo $id; ?>')" onClick="activate(this)"><?php echo $gl1; ?></div></td>
<td><div contenteditable="true" onBlur="updateValue(this, 'GL Unit Price<$500-$4,999','<?php echo $id; ?>')" onClick="activate(this)"><?php echo $gl2; ?></div></td>
<td><div contenteditable="true" onBlur="updateValue(this, 'GL Unit Price-$5000+','<?php echo $id; ?>')" onClick="activate(this)"><?php echo $gl3; ?></div></td>
</tr>
<?php
}
?>
</table>
backend.php
<?php
include 'db.inc.php';
if(isset($_POST['id'])){
$value = $_POST['value'];
$column = $_POST['column'];
$id = $_POST['id']; //md5
$sql="UPDATE crosswalk SET $column = :value WHERE md5(id) = :id LIMIT 1";
$query = $db->prepare($sql);
$query->bindParam('value',$value);
$query->bindParam('id',$id);
if($query->execute()){
echo "Update Successful";
}else{
echo "Failure";
}
}
?>
Here are the error messages I am getting
Error Pics