CODEWITHSUNDEEP
c#asp.nethtml-table
Melanie
Melanie

Reputation: 584

Adding rows to <table> dynamically

I have the following table in asp.net:

 <table style="width: 98%" id="tblOtherDoc">
    <tr>
       <td style="width: 10; text-align: left;">
          <span">Documents:</span>
       </td>
    </tr>
    <tr>
       <td>
          <asp:HiddenField ID="hidOtherPath" runat="server" Value='<%# Bind("UploadLocationOther") %>' />
          <a href="#" style="font-size: 12px; color: #2014FF; float: left; vertical-align: middle" onclick="uploadNew(this)">Add Other</a> <span style="float: left;">
          <asp:CheckBox ID="cbOther" runat="server" onclick="otherDocsClicked(this)" Checked='<%# Bind("OtherAttached") %>' /></span>
          <a href="#" style="font-size: 12px; color: #2014FF; float: left; vertical-align: middle" onclick="downloadFile(this)" title="docOther">View</a>
        </td>
     </tr>
  </table>

Each time the checkbox is clicked, I add a new exact row to the table using jquery (so that multiple documents can be added).

// Add new area for Other Document attachements
    function otherDocsClicked(row) {
        var isChecked = $(row).closest("tr").find("input[type=checkbox][id*=cbOther]").is(':checked');

        if (isChecked == true) {
            var clone = $('#tblOtherDoc tbody>tr:last').clone(true);
            clone.find("input[type='hidden'], select").val("");              
            clone.find("input[type='checkbox'], checked").removeAttr('checked');
            clone.insertAfter('#tblOtherDoc tbody>tr:last');
        }
    }

I would like to know how to add these rows dynamically using C# when I do a get to return a list of documents that have already been added.

Or alternatively, if anyone thinks there's a better way to do this I would really appreciate any input since this is the only solution I could come up with and it seems to be giving me more trouble than anything else.

Upvotes: 2

Views: 4555

Answers (2)

Captain0
Captain0

Reputation: 2613

Use Kapils answer, but remove the jquery code from the checkbox. Use jquery to attach to the on onclick event. Ins stead of onclick="otherDocsClicked(this)" in the checkbox details, add a class for the checkbox eg. chkDoSomething and then do the following.

$(".chkDoSomething").live('change',function(){
     //your code goes here.
 }

Then you should be able to add the row in c# like Kapil suggested and your jquery should still fire

Upvotes: 0

Kapil Khandelwal
Kapil Khandelwal

Reputation: 16144

You can use asp.net table control:

Table Control

Eg. Adding a row in c# code:

TableRow row = new TableRow();
                TableCell cell = new TableCell();
                cell.Controls.Add(new TextBox());
                row.Cells.Add(cell);
                table.Rows.Add(row);

In your .aspx page:

<asp:Table ID="table" runat="server" />

Upvotes: 2

Related Questions