4

我正在使用 BlockUI 来显示模式。在被阻止的模式中，我有一个更新面板。在更新面板中，我有一个文本框和一个将内容提交回服务器的按钮。到目前为止一切正常（blockUI被调用，模式出现，按钮执行回发）。但是，当触发按钮的单击事件时，即使输入了文本，文本框的值也始终为空。当更新面板更新时，文本框显示为空白。看来这可能是某种视图状态问题，我还没有关闭视图状态。

<a href="javascript:$.blockUI({ message: $('#divTest') });">SHOW MODAL</a>

<div id="divTest" style="display: none;">
<asp:UpdatePanel ID="upTest" UpdateMode="Conditional" runat="server">
    <ContentTemplate>
        <asp:TextBox ID="txtTestVS" runat="server" /><br />
        <asp:Button ID="cmdTest" Text="TEST" OnClick="cmdTest_Click" UseSubmitBehavior="false" runat="server" />
    </ContentTemplate>
</asp:UpdatePanel>

服务器端：

protected void cmdTest_Click(object sender, EventArgs e)

{ 字符串 x = txtTestVS.Text; }

字符串“x”总是等于“”。

4

4 回答 4

5

这是对话框插件的常见问题，问题是当内容被放入 blockUI 容器时，它被附加到<body>元素中，不再以提交给服务器的表单形式出现。要解决这个问题，您需要稍微编辑 blockUI 代码：

这是来源：http: //github.com/malsup/blockui/blob/master/jquery.blockUI.js

更改：
第 262 行：var layers = [lyr1,lyr2,lyr3], $par = full ? $('body') : $(el);
改为：var layers = [lyr1,lyr2,lyr3], $par = full ? $('form') : $(el);

这：
第382行：els = $('body').children().filter('.blockUI').add('body > .blockUI');
到：els = $('form').children().filter('.blockUI').add('form > .blockUI');

这应该会让你继续前进，并且文本框的值会通过。

于 2010-02-16T00:16:06.050 回答
1

问题

根据我在这里和其他地方的阅读，显然 jQuery UI（在对话框初始化时）将您的对话框元素（连同其内容）移到元素之外<form并将其附加到<body. 推测是因为当表单不存在时，主体总是存在，并且在使用 IE 时可能会有一些 z-order 好处。

问题是微软要求所有的 ASP.NET 控件都<form在页面中以参与回发并正常工作，无论它们是否是实际的 HTML 输入控件。

解决方案（jQuery 1.4+）*：以编程方式在 HTML 表单中移动对话框：

（还有其他类似的答案，这是我见过的最短的，只需要一行代码，不需要修改jQuery源代码。）

使用 jQuery UI 1.8.7（稳定，用于 jQuery 1.3.2+）我已经成功地通过从这个论坛线程派生的以下“技巧”使 ASP.NET 控件保持 PostBack 行为：

// As is customary, call $mydialog.dialog(..) to initialize it.
// Init all your dialog boxes before continuing.

// After init, TYPE THIS LINE to move all dialog boxes back into the form element
$('.ui-dialog').detach().appendTo('form');

要使用此修复程序仅针对一个对话框，请改用此行：

$mydialog.closest('.ui-dialog').detach().appendTo('form');

其中$mydialog是 jQuery 选择器 -eg 对对话框元素的引用$('#mydiv')。

使用该类的原因.ui-dialog是因为 jQuery UI 将您的对话框元素包装在具有类名 ui-dialog 的外部 div 中，该类名ui-dialog始终位于对话框的最外层元素上，并且在整个对话框中使用的所有其他类名中是唯一的。这意味着您的实际对话框不仅由您为其指定的 html 元素构成，而且您需要影响整个对话框。

在对话框初始化时，jQuery 将构建的对话框移到 HTML 表单之外。
通过插入给定的行，您可以将所有内容移回表单中，从而使 ASP.NET 快乐。

jQuery 方法将detach其从 DOM 中删除，但维护所有 jQuery 事件和与之关联的数据。
（* 因为detach是在 jQuery 1.4 中引入的，所以这个解决方案仅限于该版本和更高版本。我听说旧版本的 jQuery 可能会通过使用 clone 和 remove 来获得有限的成功，尽管我没有尝试过。）

jQuery 方法将其appendTo粘贴到 html 表单中。

这是我的理解。希望它可以帮助别人。

于 2011-01-09T02:48:16.470 回答
0

如果您的第一行代码是这样的：

<a href="javascript:$.blockUI({ message: $('#divTest').val() });">SHOW MODAL</a>

或者

<a href="javascript:$.blockUI({ message: $('#divTest').text() });">SHOW MODAL</a>
于 2010-02-16T00:12:31.020 回答
0

确保您要更新的所有内容都在更新面板中

于 2010-03-18T05:50:32.430 回答