Controls inside Update Panel and JQuery Form Look and Feel Plugin Problem!!! HELP

Question

Hi dears!
I have a problem with Updating Form Element Look and Feel under Update Panel Control.
I Used Uniform JQuery Plugin to shape form controls such as DropDown. it works very well in a ASP.net form but i used an update panel to generate CheckboxList Items when user selects a dropDownList Item.
The picture Below Shows form Look and Feel:

but when I Select a Category from list to update the UpdatePanel Template and updating CheckBoxes the uniform style removes from controls located inside update panel:

I call uniform function above the form:

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

and Update Panel Markup:

    <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>

Know Can Anyone Help me to correct this bug??? is there any possible way to keeping update panel control style from removing?

Answer 1

You can't keep it from removing the styles (the elements are replaced completely), but you can re-apply it by running this once in your code:

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

What this does is attach an event handler to run the plugin again when the endRequest event of the UpdatePanel fires (each time it comes back with new content/elements).

As noted in comments, wrapping the UpdatePanel in a wrapper will restrict the plugin to just this area.