将对话框的位置保留在脚本中

Question

我有一个表格，我希望显示一个带有对话框的部分。

但是，当我将表单内部分配给对话框时，它将位于脚本的底部，而不再是表单元素的内部，因此我不能提交值。

喜欢：

<form>
<div id="dialog_container"><input name="test"></div>
</form>
<script> $('#dialog_container').dialog();</script>

在这种情况下，div不留在表格标签中。

您将如何解决此问题？

谢谢！

Answer 1

我添加了相同的问题，而我所做的就是为我的每个对话框添加一个隐藏的输入。

然后，在对话框的关闭中，我可以用对话框中的值替换隐藏的输入。

类似的东西：

<div id="dialog_container">
  <form id="dialog_form">
    ... any input ...
  </form>
</div>
<form id="main_form">
  <input type="hidden" id="test">
</form>

和javascript中的类似：

  $("#dialog_container").dialog({
    close: function(ev, ui) { 
         var dialogInput // build inputs from dialogInputs
                         // you can even mix former inputs with new ones
         $("#test").replaceWith( dialogInput  )
    }
  });

Answer 2

将标签放入对话框容器中：

<div id="dialog_container">
    <form>
       <input name="test">
    </form>
</div>

编辑

为什么不想将事件on Change添加到对话框中，然后以原始形式将这些值放在隐藏的字段中，或从对话框形式中序列化JSON对象，然后将其放在隐藏的字段中。

或

使用此CSS将该部分放入Div：

#dialog_container {位置：固定;顶部：10px;左：10px;背景色：白色；显示：无；}

然后在用户单击以打开对话框之后，只需致电：$（'＃dialog_container'）。show（）;

演示：http：//jsfiddle.net/upzsq/5/