如何在dataTable中的每一行添加按钮?

时间:2016-05-17 14:22:14

标签: html asp.net-mvc-3 model-view-controller datatable

我在我的表中添加了一个动态创建表列和行的表。 我现在要做的是为该表中的每一行添加编辑删除按钮。

为了实现这一点,我尝试将两个td包含在创建表行的for..each循环中的按钮。:

@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>
}

但是这会为每一行中的每个单元格添加两个按钮,这不是预期的结果。

问题:

如何为数据表中的每一行动态创建按钮?

表格的Razr标记:

 <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>

1 个答案:

答案 0 :(得分:4)

我认为你应该把按钮放在第一个foreach上,因为这是贯穿行的。您应该使用此代码。它将生成两行按钮到行尾。

cleanup script