How to get html table data to a data table

Question

I am using a table with asp repeater. I want to retrieve table data to a data table in C#. How can I do this?

Design:

    <asp:Repeater runat="server" ID="rptItems">
       <HeaderTemplate>
        <table id="tblDetItems" border="1" style="font-size: 9pt; border-color: #A9A9A9;
        position: relative; overflow-y: auto;" class="display" cellspacing="0">
        <thead style="background: #808080; color: White; font-weight: bold; border-color: White;">
        <tr>
         <th style="width: 10px;">
            SlNo.
         </th>
        <th style="width: 200px;">
            Item Code
        </th>
        <th style="width: 300px;">
            Description
        </th>
        <th style="width: 80px;">
            Group
        </th>
        <th style="width: 100px;">
            Standard Rate
        </th>
        <th style="width: 100px;">
            Labour Charge
        </th>
        <th style="width: 100px;">
            Recovery Cost
        </th>
        <th style="width: 80px;">
            Active ID
        </th>
      </tr>
      <tr style="background-color: Silver;">
        <th style="width: 10px;">
          <input type="text" runat="server" style="width: 60px;" id="txtslno" />
        </th>
        <th style="width: 200px;">
          <input type="text" runat="server" style="width: 200px;" id="txtCode" />
        </th>
        <th style="width: 300px;">
          <input type="text" runat="server" style="width: 300px;" id="txtDesc" />
        </th>
        <th style="width: 80px;">
          <input type="text" runat="server" style="width: 80px;" id="txtGroup" />
        </th>
        <th style="width: 100px;">
          <input type="text" runat="server" style="width: 100px;" id="txtStdRate" />
        </th>
        <th style="width: 100px;">
          <input type="text" runat="server" style="width: 100px;" id="txtLbrCharge" />
        </th>
        <th style="width: 100px;">
          <input type="text" runat="server" style="width: 100px;" id="txtRcvryCost" />
        </th>
        <th style="width: 80px;">
          <select id="cmbUseId" runat="server" style="width: 80px;">
            <option value="Y">Yes</option>
            <option value="N">No</option>
          </select>
        </th>
      </tr>
      </thead>
      <tbody>
    </HeaderTemplate>
      <ItemTemplate>
       <tr>
        <td style="width: 10px; text-align: right; height: 13px;">
          <%# Eval("sl_no")%>
        </td>
        <td style="width: 200px; height: 13px;">
          <input type="text" runat="server" style="width: 190px; text-align: left; height: 13px;" id="txtCode" value='<%# Eval("item_cd")%>' onkeyup="return onkeyup_txtphystkv(this,event);" />
        </td>
        <td style="width: 300px; height: 13px;">
          <%# Eval("item_desc")%>
        </td>
        <td style="width: 80px; height: 13px;">
          <%# Eval("gp_cd")%>
        </td>
        <td style="width: 100px; text-align: right; height: 13px;">
          <input type="text" runat="server" style="width: 100px; text-align: right; height: 13px;" id="txtStdRate" value='<%# Eval("std_rt")%>' onkeyup="return onkeyup_txtphystkv(this,event);" />
        </td>
        <td style="width: 100px; height: 13px;">
          <input type="text" runat="server" style="width: 100px; text-align: right; height: 13px;" id="txtLbrCharge" value='<%# Eval("labour_charge")%>' onkeyup="return onkeyup_txtphystkv(this,event);" />
        </td>
        <td style="width: 100px; height: 13px;">
          <input type="text" runat="server" style="width: 100px; text-align: right; height: 13px;" id="txtRcvryCost" value='<%# Eval("recovery_cost")%>' onkeyup="return onkeyup_txtphystkv(this,event);" />
        </td>
        <td style="width: 80px; text-align: right; height: 18px;">
          <select id="cmbUseId" runat="server" style="width: 80px; height: 18px;">
           <option value="Y" selected="selected">Yes</option>
           <option value="N">No</option>
         </select>
        </td>
      </tr>
      </ItemTemplate>
     <FooterTemplate>
    </tbody> </table>
   </FooterTemplate>
  </asp:Repeater>

Answer 1

First thing, need to take the data entered in the controls of repeater to the server. For that the controls (TextBoxes, Dropdown lists etc.) should be accessible in code behind.

You need to Replace

<input type="text"> 
<select id="cmbUseId" runat="server">

with

<asp:TextBox id="<<appropriateId>>" runat="server" />
<asp:DropDownList id="<<dropdownListId1>>" runat="server">
    <asp:ListItem Text="Yes" Value="Y" />
    <asp:ListItem Text="No" Value="N" />
</asp:DropDownList>

On a click of button you need to create a DataTable and add appropriate columns to it.

var dataTable = new DataTable();

var column = new DataColumn();
column.ColumnName = <<columnname1>>;
column.DataType = <<columntype1>>;

dataTable.Columns.Add(column);

column = new DataColumn();
column.ColumnName = <<columnname2>>;
column.DataType = <<columntype2>>;

dataTable.Columns.Add(column);

//And So On.. to add necessary columns to the datatable.

Then loop thru all the items of the repeater, access the controls from each item and populate them in the dataRow and add the datarow in the table created above.

foreach (RepeaterItem item in rptItems.Items)
{
    var dataRow = dataTable.NewRow();

    if (item.ItemType == ListItemType.Item)
    {
        var textBox1 = (TextBox)item.FindControl("<<textboxId1>>");

        dataRow["<<columnname1>>"] = textBox1.Text;

        var textBox2 = (TextBox)item.FindControl("<<textboxId2>>");

        dataRow["<<columnname2>>"] = textBox2.Text;

        //And So On... to retrive values from all the textboxes inside the item and set values of appropriate columns in dataRow;

        var dropdownList = (DropDownList)item.FindControl("<<dropdownListId1>>")

        dataRow["<<somecolumn>>"] = dropdownList.SelectedValue;

        //Once values from all the controls of item are obtained and set in the dataRow;

        datatable.Rows.Add(dataRow);
    }
}