Edit in Place with JQuery question [Archive]

karlosio

05-31-2010, 12:45 AM

Hi Im new to JQuery and Im studying the tutorials at http://docs.jquery.com/ Im trying to follow the Edit In Place tutorial http://docs.jquery.com/Tutorials:Edit_in_Place_with_Ajax and everything was going well until I created the PHP script to do the server end. My question is what variable do I have to set in PHP so it inserts it into a MYSQL database? I assumed "t" would be the variable to grab but this enters nothing except the date into the database? Here is my code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script src="js/jquery-1.4.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function()
{
setClickable();
});

function setClickable() {
$("#editInPlace").click(function()
{
var textarea = "<div><textarea rows='10' cols='60'>" + $(this).html() + "</textarea>";
var button = "<div><input type='button' value='save' class='saveButton' /> OR <input type='button' value='cancel' class='cancelButton' /></div></div>";
var revert = $(this).html();

$(this).after(textarea + button).remove();

$(".saveButton").click(function()
{
saveChanges(this, false);
});
$(".cancelButton").click(function()
{
saveChanges(this, revert);
});
}).mouseover(function()
{
$(this).addClass("editable");
}).mouseout(function()
{
$(this).removeClass("editable");
});
}

function saveChanges(obj, cancel) {
if(!cancel) {
var t = $(obj).parent().siblings(0).val();
$.post("test2.php", {content: t}, function(txt) {
alert(txt);
});
} else {
var t = cancel;
}
$(obj).parent().parent().after('<div id="editInPlace">' + t + '</div>').remove();
setClickable();
}
</script>
<style type="text/css">
.editable {
background-color: #FF9;
cursor: pointer;
}
</style>
</head>

<body>
<div id="editInPlace">Edit Me</div>
</body>
</html>

test2.php

<?php
$server = 'localhost';
$user = 'root';
$pw = '';
$db = 'muck';

$c = mysql_connect($server, $user, $pw) or die("Cannot connect to server");
mysql_select_db($db, $c);

$text = $_POST['t'];

$sql = "INSERT INTO comments (text, date) VALUES ('$text', now())";
mysql_query($sql, $c) or die("Cannot complete query");

?>