问题标签 [edit-in-place]

支持以下内容的最佳解决方案是什么：

• 丰富的编辑器
• 就地编辑
• 占位符
• 保存 HTML 并去除恶意等。

我想要一个漂亮且可用的界面来更改配置文件上的数据。它必须支持粗体、斜体和多行文本，并确保不会注入恶意代码。

我主要在寻找 Javascript 方面，但如果它带有一些用于后端的 PHP 代码，那就太好了。

嗨，我正在尝试使用 jquery 向我的网站添加就地编辑功能。我不想使用插件，所以我的想法是，当您单击其中包含内容的 div 时，它会将 div 替换为文本框，然后在模糊时它会提交一个帖子以保存内容。

到目前为止，我有点击事件，但我不知道如何用文本框替换 div，然后让它提交模糊，我可能可以弄清楚 ajax 请求。

任何帮助都会很棒，谢谢。到目前为止，这就是我所拥有的......只是点击事件：

假设我有一个包含许多字段的复杂嵌套表单。

我想以 ajax 的方式一个接一个地编辑它的字段，这样每次我看到表单时 - 它都是“显示”样式（没有更改信息的字段），但可以切换任何特定字段或字段组使用它自己的“保存”或“更新”按钮来“编辑”模式。

解决这种问题，我最终有两种方法：

1. 扩展使用Ryan Bates 的 complex-form-examples。
   这种方式的缺点是每个字段（或字段组）都需要自己的代码（即javascript：'insert_fields'），它会呈现相应的'edit'样式表单，因此导致页面被javascripts淹没。

2. 第二 - 是通过 ajax 通过特殊控制器操作（即 get_partial）加载相应编辑部分的统一过程，它通过“编辑”形式“渲染：更新”给定字段的区域。
   对于给定的字段或字段组，我有“编辑”和“显示”的部分内容。当我需要将该字段切换到编辑模式时，我link_to ...,'/.../get_partial?partial=foo',:remote => true通过 ajax 发送带有必要参数的请求（），并且一些控制器#action 通过 javascript 呈现该部分。

我认为第二种方法更好，但我不知道如何优化它最好。

这个问题有没有更优雅的解决方案？

是否有一个特定的原因，大多数人都将就地编辑实现为显示的“显示”div和隐藏的“编辑”div，当有人像这样点击相关的“编辑”按钮时，它们会打开和关闭？

我到处看，我看到就地编辑基本上是这样处理的。当您在服务器端渲染所有视图并将它们交付给客户端时，这种方法当然是有意义的。然而，对于纯 AJAX 应用程序和像主干.js 这样的框架，我们似乎可以通过在必要时动态渲染就地编辑表单元素来使我们的代码更加干燥，甚至可能创建一个工厂方法来确定哪个表单元素渲染。例如

• 一个带有“title”类的 H1 元素被替换为<input type="text" />
• 具有“year_founded”类的跨度被替换为<input type="number" min="1900" max="2050" />
• 具有“价格”类的跨度被具有适当掩码的输入替换，仅允许输入价格。

这种渲染所有就地编辑表单元素的做法是否是在服务器端渲染页面时遗留下来的历史遗留问题？

鉴于我们使用 Backbone.js 等客户端 MVC 框架所具有的灵活性和强大功能，是否有理由不使用工厂方法在必要时动态创建和插入表单元素？像这样的东西：

HTML

Backbone.js 视图

其中 editInPlaceForm 是一个工厂，它根据 tagName 返回适当的就地编辑表单元素类型。这个工厂视图还控制它自己的所有逻辑，用于保存编辑、取消编辑、向服务器发出请求以及重新渲染被 .html() 函数替换的适当原始元素？

在我看来，如果我们使用这种方法，那么我们还可以<span class="edit_button"></span>根据用户的编辑权限即时渲染按钮，如下所示：

其中用户模型上的 allowedToEdit 函数接受模型和属性作为其参数。

我正在使用 jQuery editinPlace 插件，进行就地编辑的默认方式是在选择器上使用单击事件，但我尝试做的方式是通过调用函数“rename();”的上下文菜单。那么如何阻止点击事件的内联编辑。请分享一些关于如何做到这一点的想法......

任何人都可以推荐一个 JavaScript 库或示例代码来同时内联编辑多个字段吗？我正在寻找类似于 Flickr 的东西，当您单击照片的名称或描述时，它们都会变成 texbox，当用户单击“保存”时，它们都会被保存。

我正在使用 jQuery，所以一个 jQuery 插件会很好，但不是必需的。我已经查看了https://stackoverflow.com/questions/708801/whats-the-best-edit-in-place-plugin-for-jquery，但没有找到任何支持多个字段的。

我想知道 Swing 的内联编辑文本字段确实存在。我用谷歌搜索了一下，检查了所有我知道的 Swing 库，但我没有找到这样的组件。有没有人实现过这样的就地编辑摆动组件，或者有人知道这样的项目吗？

我知道这个 SO Thread。但我不想要“电子表格的感觉”。

- - 编辑

因为我不清楚就地编辑组件是什么意思：

本质上，组件应该看起来像一个标签，但是当我单击标签时，它会被一个文本字段替换。当然，使用 JLabel 和 JTextfield 实现这将是微不足道的，但我想要一个更复杂的解决方案。这是悬停可编辑字段时来自 Javascript 的屏幕截图：

点击它时在这里：

当然我不想要这里的选择列表，但这只是为了可视化。我希望你能明白：）

我正在编写一个 CMS，它允许以所见即所得的方式在网站上创建和编辑元素（内容块）。基本上，登录后，您会在视觉上看到同一个网站，但是悬停并单击元素会显示编辑器（如 Aloha）或其他控件。

例如：

• 悬停段落会在其侧面显示一个小菜单，允许在左对齐、居中对齐和右对齐之间进行选择
• 单击段落将使其可编辑
• 将鼠标悬停在图像上会在图像右侧显示一个点，可以拖动它从而改变图像的宽度（高度会按比例更新）
• 悬停在网站中的任何块会弹出一个“+”按钮，允许在悬停块之前创建另一个块。
• 等等

我目前的策略是使用我在Nike Better World上看到并一直使用的类似技术：有一个实例化 javascript，它在每个具有 data-controller 属性的 html 元素上调用 jquery 插件，插件的名称是由数据控制器属性指定。

稍微扩展这个概念，我将使用它将各种控件附加到内容块。

但是，作为一个菜鸟，直到最近我才遇到了 javascript mvc 框架，比如backbone.js。我一直在服务器端（在 Kohana 中）使用 MVC，但还没有在 javascript 中使用。似乎我可以使用它，但我不清楚，策略是什么。我正在开发的 CMS 是一种介于适当的 javascript 应用程序和老式 html 网站之间的混合体。我不明白，如果它们已经加载到页面 html 中（这对我来说用 javascript 加载它们没有意义），我该如何使用，例如，backbone.js 的内容块的集合对象。

有人有什么建议吗？

你们是否知道一种非常简单且小巧的就地编辑类型的插件？

我需要的只是用可编辑的输入替换我单击的文本，该输入通过 ajax on blur 提交。

我正在使用 Rails 3.1 的最新 RC，但似乎找不到适用于就地编辑的 gem。我尝试了in_place_editing gem，但我得到了

错误。带有那个 gem 的 6 行文档对我帮助不大，所以我猜这是 3.1 兼容性问题。如果有什么明显的我想念的，我很想听听。[更新：我刚刚使用 rails 3.0.10 应用程序尝试过，但它也无法在那里工作——同样的undefined method错误。]

我看过的其他宝石（例如best_in_place）也没有针对 3.1 进行更新。

关于宝石的任何提示可能有效？还是我应该等待它作为对边缘的惩罚？

我应该考虑自己滚动吗？我不太确定从哪里开始。

谢谢，斯图尔特