Блог

У меня есть рабочая функция javascript для индивидуального расширения / свертывания динамически сгенерированных вложенных gridview из родительского gridview при нажатии соответствующих кнопок. Я хотел бы добавить дополнительные функции для расширения / свертывания всех вложенных gridview при нажатии отдельной кнопки. Способ, которым я пытаюсь это сделать, использует jquery для перебора всех экземпляров кнопок развертывания / свертывания и щелчка по ним. Однако с моей реализацией расширяется только конечный gridview.

Вот функция, которая выполняется для расширения / свертывания отдельных вложенных дочерних элементов, и это то, что фактически вызывается «щелчком» в моей попытке jquery:

 function expandcollapse(obj, row) {
        var div = document.getElementById(obj);
        var img = document.getElementById('img'   obj);
        if (div.style.display == "none") {
            div.style.display = "block";
            if (row == 'alt') {
                img.src = "minus.gif";
            }
            else {
                img.src = "minus.gif";
            }
            img.alt = "Close to view other Workflows";
        }
        else {
            div.style.display = "none";
            if (row == 'alt') {
                img.src = "plus.gif";
            }
            else {
                img.src = "plus.gif";
            }
            img.alt = "Expand to show Tasks";
        }
    }
 

Это то, из чего состоит мой jquery для расширения / свертывания:

 function expandAll() {
    $('img[id^="imgdiv"]').each(function(i, obj) {
        $(this).trigger('click');
    });
}
 

И, наконец, ASP.NET код, который я пытаюсь расширить:

 ...
<asp:TemplateField HeaderText="<img src='plusbutton.png' onclick='expandAll();'>" >
<ItemTemplate>
    <a href="javascript:expandcollapse('div<%# Eval("WorkflowID") %>', 'one');">
        <img id="imgdiv<%# Eval("WorkflowID") %>" alt="Click to show/hide Tasks for Workflow <%# Eval("WorkflowID") %>" width="9" border="0" src="plus.gif" />
    </a>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
    <asp:LinkButton ID="lbEdit" CommandArgument='<%# Eval("WorkflowID") %>' CommandName="EditRow" ForeColor="#8C4510" runat="server">Edit</asp:LinkButton>| 
    <asp:LinkButton ID="lbDelete" OnClientClick="return confirm('Are you sure you want to delete this row?');" CommandArgument='<%# Eval("WorkflowID") %>' CommandName="DeleteRow" ForeColor="#8C4510" runat="server" CausesValidation="false">Delete</asp:LinkButton>
</ItemTemplate>
<EditItemTemplate>
    <asp:LinkButton ID="lbUpdate" CommandArgument='<%# Eval("WorkflowID") %>' CommandName="UpdateRow" ForeColor="#8C4510" runat="server">Update</asp:LinkButton>
    <asp:LinkButton ID="lbCancel" CommandArgument='<%# Eval("WorkflowID") %>' CommandName="CancelUpdate" ForeColor="#8C4510" runat="server" CausesValidation="false">Cancel</asp:LinkButton>
</EditItemTemplate>
<FooterTemplate>
    <asp:LinkButton ID="lbInsert" ValidationGroup="Insert"
        runat="server" ForeColor="#8C4510" CommandName="InsertRow">Insert
    </asp:LinkButton>
</FooterTemplate>
</asp:TemplateField>
...
 

При нажатии кнопки, вызывающей функцию jquery, все вложенные gridview должны развернуться / свернуться. То, что у меня есть в настоящее время, вступает в силу только для последнего вложенного gridview.