使用Jeditable保存已编辑的值

时间:2009-08-18 19:22:00

标签: jquery ajax codeigniter inline-editing

我一直在寻找一个非常好的,记录良好的jquery插件,让我可以在点击另一个按钮时编辑值。

Jeditable是我发现的最接近的,但我不知道如何保存,即使在测试中也是如此。真正快速的东西会返回价值。

我在我的php脚本中使用它:

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

这是我的JS脚本:

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

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

这是我的HTML:

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

修正: php应该是:

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

2 个答案:

答案 0 :(得分:3)

Jeditable

来自Jeditable的例子:

  

在此示例中,load.php应返回未呈现的标记源xhtml。但是save.php应该返回渲染的xhtml。保存浏览器时将显示保存脚本返回的确切内容。还有另一种选择。您可以在数据参数中传递标记源。

所以save.php应该返回(打印到页面) text (不是html),它将在编辑过的地方显示。它还应该保存对数据库或您应该执行的任何其他服务器端工作的更改。

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

save.php上,您可以执行任何存储新值的操作。

这里有另一个tutorial for the in-line editor for jQuery

答案 1 :(得分:1)

toggledit有一个简单的回调机制(onpreview,onedit)和一个简单的公共方法api(编辑,预览)。

要保存,您可以编写自己的ajax函数,在触发这些或其他事件时触发...例如如果点击了保存按钮。

切换到编辑模式的监听器也是可配置的 - 您可以传入按钮选择器:

$(form).find('input,select').toggleEdit({
    listeners: {
        edit: '#your_button'
    }
});

另外,您可以使用公共活动手动触发按钮的编辑和预览:

$(el).toggleEdit('edit');
$(el).toggleEdit('preview');

另请参阅https://stackoverflow.com/questions/708801/whats-the-best-edit-in-place-plugin-for-jquery/:&gt;