更新面板中的控件和 JQuery 表单外观插件问题！！！帮助答案

【问题标题】：Controls inside Update Panel and JQuery Form Look and Feel Plugin Problem!!! HELP更新面板中的控件和 JQuery 表单外观插件问题！！！帮助
【发布时间】：2010-08-19 21:50:41
【问题描述】：

我在更新面板控件下更新表单元素外观时遇到问题。
我使用Uniform JQuery Plugin 来塑造表单控件，例如 DropDown。它在 ASP.net 表单中运行良好，但当用户选择 dropDownList 项目时，我使用更新面板生成 CheckboxList 项目。
下图显示表单外观：

但是当我从列表中选择一个类别来更新 UpdatePanel 模板并更新 CheckBoxes 时，统一样式会从位于更新面板内的控件中删除：

我在表格上方调用统一函数：

            <script type="text/javascript">
                $(function() {
                    $("input, textarea, select, button").uniform();
                });
            </script>

和更新面板标记：

    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
            <p>
                انتخاب دسته:&nbsp;<myCtrl:CategoryDDL AutoPostback="True" EmptyItemText="همه‌ی دسته‌ها"
                    ID="CategoryDDL" OnSelectedIndexChanged="CategoryDDL_SelectedIndexChanged" runat="server"
                    SelectedCategoryId="0" />
            </p>
            <p>
                برند محصولات<br />
                <asp:CheckBoxList ID="CheckBoxListBrands" runat="server">
                </asp:CheckBoxList>
            </p>
        </ContentTemplate>
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="CategoryDDL" />
        </Triggers>
    </asp:UpdatePanel>

知道任何人都可以帮我纠正这个错误吗？？？有什么方法可以防止更新面板控件样式被删除？

【问题讨论】：

标签： asp.net jquery jquery-plugins updatepanel look-and-feel

【解决方案1】：

您无法阻止它删除样式（元素被完全替换），但您可以通过在代码中运行一次来重新应用它：

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function() {
  $("#updatePanelDiv :input").uniform();
});

它的作用是附加一个事件处理程序，以便在 UpdatePanel 的 endRequest event 触发时再次运行插件（每次返回新内容/元素时）。

如 cmets 中所述，将 UpdatePanel 包装在包装器中会将插件限制为仅此区域。

【讨论】：

谢谢Craver先生！您的代码运行良好。但是您的代码有一个小错误。每次更新面板更新它的内容时，我表单中的所有其他输入都会加倍。为了防止这种情况，我将所有更新面板控件放在一个 div 标签中，并像这样更正了选择器：( $("#update_panel_container :input").uniform();) 请更新您的答案以供其他人使用。

【解决方案2】：

改变这个方法

$(function() {
$("input, textarea, select, button").uniform();
});

与

function pageLoad(){
 $("input, textarea, select, button").uniform();
}

就是这样..

【讨论】：