呼叫脚本或CSS样式的更新面板 [英] Call script or css style in the update panel

查看:137
本文介绍了呼叫脚本或CSS样式的更新面板的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用的是网页,由于该下拉菜单,复选框和文本框的风格得到改变一个剧本,但如果我把下拉列表或任何其他工具的UpdatePanel内该工具的脚本不被调用。

I am using a script on a page due to which the style of dropdown , checkbox and textbox get changes, but if i put dropdown or any other tool inside the updatepanel the script of that tool is not called.

这是我的HTML部分

<head runat="server">
<title>script not working</title>      
<script src="js/jquery/jquery-1.4.1.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="jqtransformplugin/jqtransform.css" type="text/css" media="all" />
<script type="text/javascript" src="jqtransformplugin/jquery.jqtransform.js"></script>

<script language="javascript">
    $(function() {
        $('form').jqTransform({ imgPath: 'jqtransformplugin/img/' });
    });
</script>
</head>
<body>
<form id="form1" runat="server">    
    <table cellpadding="0" cellspacing="0">
        <tr>
            <td>
                <asp:ScriptManager ID="ScriptManager1" runat="server">
                </asp:ScriptManager>                 
            </td>               
        </tr>
        <tr>
            <td>
                <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                    <ContentTemplate>
                        <asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True" 
                            onselectedindexchanged="DropDownList1_SelectedIndexChanged">
                            <asp:ListItem>1</asp:ListItem>
                            <asp:ListItem>2</asp:ListItem>
                            <asp:ListItem>3</asp:ListItem>
                            <asp:ListItem>4</asp:ListItem>
                            <asp:ListItem>5</asp:ListItem>
                            <asp:ListItem></asp:ListItem>
                        </asp:DropDownList>
                    </ContentTemplate>
                </asp:UpdatePanel>
            </td>               
        </tr>            
        <tr>               
            <td>
                <asp:UpdatePanel ID="UpdatePanel2" runat="server">
                    <ContentTemplate>
                        <asp:DropDownList ID="ddtrial" runat="server" AutoPostBack="True" 
                            onselectedindexchanged="ddtrial_SelectedIndexChanged">
                            <asp:ListItem>1</asp:ListItem>
                            <asp:ListItem>2</asp:ListItem>
                            <asp:ListItem>3</asp:ListItem>
                            <asp:ListItem>4</asp:ListItem>
                            <asp:ListItem>5</asp:ListItem>
                            <asp:ListItem></asp:ListItem>
                        </asp:DropDownList>
                    </ContentTemplate>
                </asp:UpdatePanel>
            </td>
        </tr>           
    </table>   
</form>
</body>

我面临着以下问题:

I am facing the following problem:

在页面加载得到脚本应用到显示的下拉但每当下拉之一,是选择这两个变化的下拉脚本被删除。

When the page gets load script is applied to the dropdown is shown but whenever one of the dropdown is select changes both of the dropdown script gets removed.

推荐答案

检查答案在 418072 ,回答<一个href=\"http://stackoverflow.com/questions/1626515/how-to-execute-javascript-once-an-update-panel-refreshes-cant-get-sys-webforms\">1626515,和下面的如何的。

Check answer on 418072, answer on 1626515, and the following how to.

问题是如下。当你的页面被加载时,浏览器应用插件jqTransform的形式和插件添加类相关的标签。

The problem is the following. When your page gets loaded, the browser applies the jqTransform plugin to the form and the plugin adds classes to relevant tags.

当您选择下拉菜单中的一项,浏览器刷新数据并移除该插件添加的类。这就是为什么如预期的元素是不能再称呼。

When you select an item in the dropdown menu, the browser refreshes the data and removes the classes added by the plugin. That's why the elements are not anymore styled as expected.

的解决方案是在每次刷新后到插件应用到表格

The solution is to apply the plugin to the form after each refresh.

请尝试以下code:

<script type="text/javascript">
    $(function() {
        $('form').jqTransform({ imgPath: 'jqtransformplugin/img/' });

        var prm = Sys.WebForms.PageRequestManager.getInstance();
        prm.add_endRequest(EndRequestHandler);

        function EndRequestHandler(sender, args) 
        {
            $('form').jqTransform({ imgPath: 'jqtransformplugin/img/' });
        }
    });
</script>

我无法测试code,但我希望它可以帮助你进一步。

I'm unable to test the code, but I hope it helps you further.

这篇关于呼叫脚本或CSS样式的更新面板的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆