使用 Jeditable 保存编辑值

Question

我一直在寻找一个非常好的、文档齐全的 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'); 

Answer 1

Jeditable，

来自 Jeditable 的示例：

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

因此，save.php 应该返回（打印到页面）将在编辑位置显示的文本（而不是 html）。它还应该保存对数据库的更改或您应该执行的任何其他服务器端工作。

您使用 javascript 发布，并向客户端回显响应。 http://img34.imageshack.us/img34/3412/savephp.png

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

这里有另一个教程jQuery 的行编辑器。

Answer 2

toggledit 有一个简单的回调机制（onpreview、onedit），以及一个简单的公共方法api（edit、preview） ）。

要保存，您可以编写自己的 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/ ：>