Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    Regular Coder
    Join Date
    Dec 2006
    Location
    In the wilderness
    Posts
    106
    Thanks
    9
    Thanked 5 Times in 5 Posts

    Edit in Place with JQuery question

    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:Edi...lace_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:

    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 Code:
    <?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");

    ?>
    "The advantage of computers is that they do exactly what you tell them to do. The disadvantage of computers, on the other hand, is that they do exactly what you tell them to do."

    Excellent resource for learning PHP here

  • #2
    Regular Coder
    Join Date
    Dec 2006
    Location
    In the wilderness
    Posts
    106
    Thanks
    9
    Thanked 5 Times in 5 Posts
    Ive managed to figure it, looking at someones else's post on another thread, someone suggested using firebug, and that made me figure out that the post variable was content, not t which i originally thought. What a great extension
    "The advantage of computers is that they do exactly what you tell them to do. The disadvantage of computers, on the other hand, is that they do exactly what you tell them to do."

    Excellent resource for learning PHP here


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •