I have a html table that contains values in my mysql db table. Client ask for a front-end editing of data in my html table. So i make td transform to selection box when click, where the user will choose X and O remarks.
this is my script :
$(document).on('click', 'td', function() { ////---make td transform to dropdown list box when click---///
if($(this).find('select').length == 0) {
$(this).empty(); //clears out current text in the table
$(this).append('<select onchange="myFunction()" id="Remarks" name="Remarks"><option value=""></option><option <?php if ($Remarks=='X') echo 'selected';?> value="X" style="font-size:20px;font-weight:bold;">X<option style="font-size:20px;color:green;font-weight:bold;" <?php if ($Remarks=='O') echo 'selected';?> value="O">O</select>');
}
});
$(document).on('focusout', 'td select', function(){
var myValue = $(this).val();
var $parent = $(this).parent();
$(this).remove();
$parent.append(myValue);
});
What I Need is to make update for the value of td based on what the user choose from the selection box.
This is what I have tried : Making an onchange for the selection box
function myFunction(){
var emp_name = document.getElementById('employeeName').value;
var r = document.getElementById('Remarks').value;
$.ajax({
type: 'post',
url: 'update_data.php',
data: {
'employeeName' :emp_name,
'DAY1' : r
},
success: function(data){
$("#content").html(data)
$(".loader").fadeOut("veryslow");
$("#content").hide().fadeIn(500)
//alert(r);
//alert(emp_name);
},
error:function(data){
alert('Failed');
}
})
};
and this is my update_data.php :
<?php
$employeeName = $_REQUEST["employeeName"];
$Remarks = $_REQUEST["Remarks"];
//$id = $_REQUEST["id"];
try {
$pdo = new PDO('mysql:host=localhost:***;dbname=******;', '*****', '*****' );
$pdo->setAttribute( PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION );
$pdo->query( 'SET NAMES UTF8' );
$stmt = $pdo->prepare(
"UPDATE `mbwa`
SET
`DAY1` = :Remarks
WHERE
`employeeName` = :employeeName
"
);
$stmt->bindValue(':employeeName',$employeeName,PDO::PARAM_STR);
$stmt->bindValue(':Remarks',$Remarks,PDO::PARAM_STR);
//$stmt->bindValue(':id',$id,PDO::PARAM_STR);
$stmt->execute();
header('location:./');
} catch ( PDOException $e ) {
var_dump( $e->getMessage() );
}
$pdo = null;
?>
it updates the database but it gives a value of null in value of the td that i make change. I think it doesn't get the value of ':Remarks' in my update query.
any help?
$_REQUEST["Remarks"];
should be$_REQUEST["DAY1"];
(check the ajax params sended!)data: { 'employeeName' :emp_name,'DAY1' : r}
, your php should$_REQUEST
foremployeeName
andDAY1
. So, there's another error but you should first solve this.var r = document.getElementById('Remarks').value;
gives you a array. Try to console log empoyeeName and r before ajax.