mardi 17 mai 2016

How to add buttons to each row in a dataTable?

I've added a table to my which dynamically creates the table columns and rows. What I'm trying to do now is add an Edit and Delete button to each row in that table.

In order to achieve that I tried placing two td's containing the buttons wihthin the for..each loop that creates the table rows.:

@foreach (var cell in row.ItemArray) {
  <td style="word-wrap:break-word;font-size:11px">@cell.ToString()</td>
  <td><a class="btn-success">Edit</a></td>
  <td><a class="btn-danger">Delete</a></td>
}

But this add two buttons to each cell in every row which is not the intended outcome.

Question:

How can buttons be dynamically created for each row in a data table?

Razr markup for table:

 <table id="escalation" class="table table-striped table-bordered" cellspacing="0" width="100%">
    <thead>
        <tr>
            @foreach (System.Data.DataColumn col in Model.Columns)
            {
                <th style="font-size: 12px; border-right: 1px solid #7591ac; ">@col.Caption</th>

            }
        </tr>
    </thead>
    <tbody>
        @foreach (System.Data.DataRow row in Model.Rows)
        {
            <tr>
                @foreach (var cell in row.ItemArray)
                {
                    <td style="word-wrap:break-word;font-size:11px">@cell.ToString()</td>
                    <td><a class="btn-success">Edit</a></td>
                    <td><a class="btn-danger">Delete</a></td>
                }

            </tr>
        } 
    </tbody>
</table>

Aucun commentaire:

Enregistrer un commentaire