Question

我的javascript可以在任何页面上正常工作。我想使用相同的代码来扩展/折叠ASP.NET GridView中的项目字段。以下代码仅适用于第一个项目，但不适用于其他项目。有什么想法吗？

<script type="text/javascript">
    jQuery(function ($) {
        var setupModule = function () {
            $('#panels-demo').dnnPanels();
            $('#panels-demo .dnnFormExpandContent a').dnnExpandAll({
                targetArea: "panels-demo"
            });
        };
        setupModule();
        Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function () {
            // note that this will fire when _any_ UpdatePanel is triggered,
            // which may or may not cause an issue
            setupModule();
        });
    });
</script>

Aspx页面：

<ItemTemplate>
                <div class="dnnForm" id="panels-demo">
                    <div class="dnnFormExpandContent"><a href="#">Expand All</a></div>
                    <h2 id="tabPassport" class="dnnFormSectionHead"><a href='<%# "#" & Eval("ApplicationID") %>'>Options</a></h2>
                    <fieldset class="dnnClear">
                        <img src="<%=ResolveUrl("/images/passport.jpg") %>" alt="Passport upload" class="dnnLeft" style="width: 10px; height: 10px" />
                        <div class="dnnRight" style="width: 90%; margin-left: 2%">

                            <label>Email user</label>

                            <asp:Label runat="server" ID="StatusLabel"></asp:Label>
                        </div>
                    </fieldset>
                </div>
            </ItemTemplate>

Answer 1

将此添加到页面以折叠所有项目（编辑＆＃39; div [id ^ =＆＃34; panels-demo＆＃39;使用您自己的jquery选择器!!!）：

<pre>
<script type="text/javascript">
    jQuery(function ($) {
        //collapse panels
        $('div[id ^= "panels-demo"] a').removeClass('dnnSectionExpanded');        
        $('fieldset.dnnClear').hide();
    });
</script> 
</pre>

添加此项以展开所有项目：

<pre>
<script type="text/javascript">
    jQuery(function ($) {
        //expand paneles
        $('div[id ^= "panels-demo"] a').addClass('dnnSectionExpanded');
        $('fieldset.dnnClear').show();
    });
</script>
</pre>

在GridView中扩展/折叠项目

1 个答案: