Saving edited values using Jeditable

matthewb picture matthewb · Aug 18, 2009 · Viewed 8.9k times · Source

I have been looking for a really good, well documented jquery plug-in that will let me edit values on click of another button.

Jeditable is the closest I've found yet, However I am not sure how to get it to save, even in testing. Something really quick that returns the value.

I am using this for my php script:

function editprofile()
{
    $this->input->post('value');
}

This is my JS script:

$("a.edit").live('click', function(){

     $(this).parent("li").find("span.detail").editable('profile/editprofile', 
     {
         indicator : 'Saving...',
         submit  : 'OK',
         tooltip   : 'Click to edit...'
     });    
});

This is my HTML:

<span id="city" class="detail">Philadelphia</span>
<a href="javascript:;" class="edit">Edit</a>

Fixed: php should be:

echo $this->input->post('value'); 

Answer

Esteban K&#252;ber picture Esteban Küber · Aug 18, 2009

Jeditable,

From Jeditable's example:

In this example load.php should return the markup source not rendered xhtml. However save.php should return rendered xhtml. When saving the browser will display exactly what saving script returns. There is also another option. You can pass markup source in data parameter.

So save.php should return (print to the page) the text (not the html) that is going to be showed in the edited place. It should also save the changes on the database or any other serverside work that you should do.

You post with javascript, and echo to the client the response. http://img34.imageshack.us/img34/3412/savephp.png

On save.php you do anything you store the new value.

Here you have another tutorial for the in-line editor for jQuery.