ツリービューとAjaxを使用したテーブル

Question

私はgroup byとajaxの機能を持つテーブルを用意したいと思います。

例：（各列のソート機能付き）

表ヘッダ

• +/-要素1 により要素1のすべての要素の
  • テーブルビューをグループ（崩壊または拡大する画像）
• +/-（画像を折りたたむ、または拡大する）要素2でグループ化する
  /-
• エレメント2
のすべての要素の
• テーブルビューエレメント3

のすべての要素あなたの場合の

• テーブルビューエレメント3によってグループ（画像は、折りたたんだり展開し） "Group1 by Element1"をクリックすると、Element1のすべての要素のテーブルビューをロードするためのajaxリクエストが必要です。 、エレメント2とエレメント3のために同じなど

  私はあなたが私が:-)

  これを行うための最善の方法は何ですか望むものを理解してほしいですか？ Ajax、ASP：ツリービューなど？

  おかげ

Answer 1

これは可能ですが、親コンテナとしてListViewまたはDataListを使用します。この打撃を与える：

<table width="595px"> 
    <asp:DataList BackColor="#ffffff" id="DataList1" DataKeyField="<ID>" OnItemDataBound="DataList1_ItemDataBound" runat="server" Width="100%">  
     <ItemTemplate> 
      <tr> 
       <td> 
        <asp:LinkButton ID="LinkButton1" runat="server" Text="+" OnCommand="LinkButton1_Command" CommandArgument='<%#Container.ItemIndex%>'></asp:LinkButton>  
       </td> 
       <td><%#Eval("<COLUMN NAME>")%></td> 
       <td><%#Eval("<COLUMN NAME>")%></td> 
       <td><%#Eval("<COLUMN NAME>")%></td> 
      </tr> 
      <asp:Panel ID="pnlChildView" runat="server"> 
       <asp:DataList ID="DataList2" runat="server" Width="100%"> 
        <ItemTemplate> 
         <tr> 
          <td><%#Eval("<CHILD OLUMN NAME>")%></td> 
          <td><%#Eval("<CHILD COLUMN NAME>")%></</td> 
          <td><%#Eval("<CHILD COLUMN NAME>")%></</td>       
         </tr> 
        </ItemTemplate> 
       </asp:DataList> 
      </asp:Panel> 
     </ItemTemplate> 
    </asp:DataList> 
</table> 

、ユーザーがDataList1でLinkBut​​tonコントロール/ボタンをクリックすると、このような何かを：

protected void LinkButton1_Command(object sender, CommandEventArgs e) 
{ 
    //pass index of item in command argument 
    int itemIndex = Convert.ToInt32(e.CommandArgument);  

    //find the pnlChildView control 
    Panel childViewPanel = (Panel)DataList1.Items[itemIndex].FindControl("pnlChildView"); 
    if (childViewPanel != null) 
    { 
     //toggle visibility of childViewPanel and bind child list if panel is visible 

     if (childViewPanel.Visible) 
     { 
      DataList childList = childViewPanel.FindControl("DataList2"); 
      if (childList != null) 
      { 
       int keyValue = (int)DataList1.DataKeys[itemIndex]; 

       //bind the list using DataList1 data key value 
       childList.DataSource = <DATA SOURCE>; //get data using keyValue 
       childList.DataBind(); 
      } 
     } 
    } 
} 

Answer 2

おそらくあなたのニーズに合ういくつかの製品があります。

• JQTreeTable
• Tree and TreeTable
• jQuery treeTable

と他の人が...