将 ASP.NET 元素动态添加到 JQuery 对话框答案

【问题标题】：Add ASP.NET Element to JQuery Dialog dynamically将 ASP.NET 元素动态添加到 JQuery 对话框
【发布时间】：2012-03-05 06:01:47
【问题描述】：

我在 JQuery 对话框中放置了一些 ASP.NET html 元素（用于上传文件）。

我的问题：当我点击按钮上传文件时，什么也没有发生。我在页面加载后动态创建查询对话框。我的解决方案是将 HTML/ASP 元素（用于上传文件）放在页面主体底部的 div 中，并将其显示设置为无。

然后在打开对话框时，我将 HTML/ASP 元素移动到 JQuery 对话框中。但我的问题是，当我单击 ASP.NET 按钮从对话框中上传文件时，什么也没有发生？

请注意，如果我在 JQuery 对话框外部成功上传文件时单击该按钮。

出了什么问题，我该如何解决？有没有更简单的方法在页面加载后将 ASP.NET 代码添加到 JQuery 对话框？

这在体内

<div id="test">
    <input class="ui-button ui-widget ui-state-default ui-corner-all 
       ui-button-text-only" 
      style="display: inline-block;" id="fileUpload" type="file" Runat="server" 
       NAME="fileUpload"/>

    <asp:button id="btnSave" OnClick="bt1Clicked" style="display: inline;" 
      class="ui-button ui-widget ui-state-default ui-corner-all 
                                                 ui-button-text-only" 
      runat="server" Text="Upload File" ></asp:button>

    <asp:label id="lblMessage" runat="server" style="height:20px;width:390px;"
    </asp:label> 
</div>

然后在对话框打开时，我抓取上面的 HTML 并将其移动到对话框中：

$(this.dialog).dialog('open' function()
{
   var e = $("#test");
   $(body).remove(e);
   $(this).append(e);
});

【问题讨论】：

您的 jquery 对话框是否显示但文件上传没有发生？您的浏览器是否有任何错误？
remove 采用选择器而不是对象。你可以只做e.remove(); 然后追加。 api.jquery.com/remove这听起来也是一个常见的问题，在这里回答：stackoverflow.com/a/768163/701062

标签： c# jquery css

【解决方案1】：

jQuery UI 对话框在文档的最后创建对话框元素，就在关闭 </body> 元素之前。因此，当您打开对话框并将内容 div#test 移动到对话框中时，它位于 <form> 之外，并且不再适用于需要它的 asp.net。

尝试创建您的对话框并将其移回 <form> 元素内：

$("#myDialog").dialog({
    ...
}).parent().appendTo($("form"));

【讨论】：