使用DataSet內容渲染Div，包括列

我很努力地將我的DataSet內容呈現爲列名稱爲標題的DIV標記。使用DataSet內容渲染Div，包括列

我想一個結構中得到它，像這樣：

<div class="dataset"> 
     <div class="dsheader"> 
      <div class="dscell"><h6>Staff Name</h6></div> 
      <div class="dscell"><h6>Accrued Hours</h6></div> 
      <div class="dscell"><h6>Date Accrued</h6></div> 
     </div> 

     <div class="dsrow"> 
      <div class="dscell"><p>1</p></div> 
      <div class="dscell"><p>2</p></div> 
      <div class="dscell"><p>3</p></div> 
     </div> 

     <div class="clearfix"/>    
</div>

我不知道如何下手，所以我開始最簡單的方式和數據呈現爲一個表：

Dim r As DataRow 
    Dim dvCont As New HtmlGenericControl 
    Dim dvHead As New HtmlGenericControl 
    Dim dvRow As New HtmlGenericControl 
    Dim dvCell As HtmlGenericControl 


    For i As Integer = 0 To DataTable.Rows.Count - 1 

     Dim myRow As New HtmlTableRow 
     Dim divrow As New HtmlGenericControl 
     Dim divcell As New HtmlGenericControl 
     Dim StaffMemberCell As New HtmlTableCell 
     Dim LieuTypeCell As New HtmlTableCell 
     Dim LieuDateCell As New HtmlTableCell 
     Dim LieuDetailsCell As New HtmlTableCell 

     StaffMemberCell.InnerHtml = DataTable.Rows(i).Item("staff_member").ToString 
     myRow.Cells.Add(StaffMemberCell) 

     LieuTypeCell.InnerHtml = DataTable.Rows(i).Item("lieu_type").ToString 
     myRow.Cells.Add(LieuTypeCell) 

     LieuDateCell.InnerHtml = DataTable.Rows(i).Item("lieu_date").ToString 
     myRow.Cells.Add(LieuDateCell) 

     LieuDetailsCell.InnerHtml = DataTable.Rows(i).Item("lieu_details").ToString 
     myRow.Cells.Add(LieuDetailsCell) 

     lieuTable.Rows.Add(myRow) 
    Next

我從哪裏出發？我知道在ASPX頁面上添加runat="server"到DIV標籤。

<div id="dvContainer" class="dataset" runat="server"> 
    <div id="dvContHeader" class="dsheader" runat="server"> 
     <div id="dvContCell" class="dscell" runat="server"><h6>Header</h6></div> 
     <div id="Div1" class="dscell" runat="server"><h6>Header</h6></div> 
     <div id="Div2" class="dscell" runat="server"><h6>Header</h6></div> 
    </div> 

    <div id="dvRow" class="dsrow" runat="server"><p>data1</p></div> 
     <div id="dvContCell" class="dsrow" runat="server"><p>data1</p></div> 
     <div id="Div4" class="dsrow" runat="server"><p>data1</p></div> 
     <div id="Div5" class="dsrow" runat="server"><p>data1</p></div> 
    </div> 
</div>

我的另一個問題是我必須在ASPX文檔中明確指出div嗎？見下文。我看到多次使用ID標記的問題。

來源

2014-02-14 ZeroBased_IX

我通過使用中繼器實現了我正在尋找的結果。

<asp:Repeater ID="Repeater1" runat="server"> 

<HeaderTemplate> 
    <div class="dsDataSet"> 
      <div class="dsheader"> 
       <div class="dscell"><h6>Staff Name</h6></div> 
       <div class="dscell"><h6>Accrued Hours</h6></div> 
       <div class="dscell"><h6>Date Accrued</h6></div> 
      </div> 
</HeaderTemplate> 
<ItemTemplate> 
      <div class="dsrow"> 
       <div class="dscell"><p><%# Eval("Staff_member")%></p></div> 
       <div class="dscell"><p><%# Eval("Num_Hours")%></p></div> 
       <div class="dscell"><p><%# Format(Eval("Lieu_Date"), "dd-MM-yyyy")%></p></div> 
      </div> 

</ItemTemplate> 

<FooterTemplate> 
     <div class="clearfix"/> 
    </div> 
</FooterTemplate> 
</asp:Repeater>

來源

2014-02-14 13:10:54

使用DataSet內容渲染Div，包括列

回答

相關問題