在表单中实现查看/编辑模式

Question

我们的表单需要支持查看/编辑模式。在编辑模式下，所有字段都是可编辑的。在查看模式下，它们是只读的。也许有可以应用的 CSS 样式，或者输入框可以转换为标签。

仅供参考，我们的应用在 Spring MVC 中，我们研究了一些想法：

1. 扩展 Spring MVC 的 Form 标签以支持从服务器端查看/编辑
2. 一些 JS/jQuery 调整
3. 一些 CSS 调整

我发现了一个类似的线程： Implement read / edit mode in form

 <form data-mode="read">
    <input value="Hello" />
 </form>

if($('form').data('mode') == 'read'){   //remove fields and add text
  $('form').find(':input').each(function(){
     $(this).replaceWith($('<span>' + $(this).val() + '</span>');
  });
 }

建议是有一个 Form 标签属性，例如“数据模式”，但这是自定义属性吗？

从 JS、CSS 或 SpringMVC（服务器端）的角度来看，有哪些标准的、好的解决方案？

Answer 1

您可以同时拥有该表单。输入和标签并根据表单模式显示/隐藏它们。

<div style"display:none">
Name: <input>
<div>
<div>
  Name: My Name 
<div>