如何从选择行中检索数据库数据

时间:2014-06-27 02:51:51

标签: javascript jquery asp.net-mvc datatables

如何从我的表中实际检索所选行的主键(model.ID)。并且如果选择单行,我想要进行相同的操作按钮A B C已启用但如果选择了多行,则仅启用按钮c,将禁用a和b。 我在下面发布了我的编码。

$(document).ready(function () {
    var table = $('#LineTables').DataTable();

    $('#LineTables tbody').on('click', 'tr', function () {
        if ($(this).hasClass('selected')) {
            $(this).removeClass('selected');
        }
        else {
            table.$('tr.selected').removeClass('selected');
            $(this).addClass('selected');
        }
    });
    });
});

<table id="LineTables" class="display dataTable">
<thead>
    <tr>
        <th>@Html.DisplayNameFor(model => model.Priority)</th>
        <th>@Html.DisplayNameFor(model => model.ProductionOrderNumber)</th>
        <th>@Html.DisplayNameFor(model => model.SalesOrder.Product.ProductGroup.Name)</th>
        <th>@Html.DisplayNameFor(model => model.SalesOrder.Product.ProductName)</th>
        <th>@Html.DisplayNameFor(model => model.Quantity)</th>
        <th>@Html.DisplayNameFor(model => model.SalesOrder.Product.Pole)</th>
        <th>@Html.DisplayNameFor(model => model.SalesOrder.Product.Amperage)</th>
        <th>@Html.DisplayNameFor(model => model.SalesOrder.SalesOrderType1.Name)</th>
        <th>@Html.DisplayNameFor(model => model.SalesOrder.Market)</th>
        <th>@Html.DisplayNameFor(model => model.ProductionOrderStatu.Name)</th>
        <th>@Html.DisplayNameFor(model => model.SalesOrder.SalesOrderNumber)</th>
        <th></th>
    </tr>
</thead>
<tbody>
    @foreach (var item in Model)
    {
        <tr>
            <td>@Html.DisplayFor(modelItem => item.Priority)</td>
            <td>@Html.DisplayFor(modelItem => item.ProductionOrderNumber)</td>
            <td>@Html.DisplayFor(modelItem => item.SalesOrder.Product.ProductGroup.Name)</td>
            <td>@Html.DisplayFor(modelItem => item.SalesOrder.Product.ProductName)</td>
            <td>@Html.DisplayFor(modelItem => item.Quantity)</td>
            <td>@Html.DisplayFor(modelItem => item.SalesOrder.Product.Pole)</td>
            <td>@Html.DisplayFor(modelItem => item.SalesOrder.Product.Amperage)</td>
            <td>@Html.DisplayFor(modelItem => item.SalesOrder.SalesOrderType1.Name)</td>
            <td>@Html.DisplayFor(modelItem => item.SalesOrder.Market)</td>
            <td>@Html.DisplayFor(modelItem => item.ProductionOrderStatu.Name)</td>
            <td>@Html.DisplayFor(modelItem => item.SalesOrder.SalesOrderNumber)</td>
            <td>
                @Html.ActionLink("New Barcode", "Barcode", new { id = item.ID }, new { @class = "barcode btnic btnicon" })
            </td>
        </tr>
        } </tbody>

</table>
@Html.ActionLink("A", "Index", "A", .......... , new { @class = "btn btn-default btn-ms" })
@Html.ActionLink("B", "Index", "B", .......... , new { @class = "btn btn-default btn-ms" })
@Html.ActionLink("C", "Index", "C", .......... , new { @class = "btn btn-default btn-ms" })

1 个答案:

答案 0 :(得分:0)

基于上述评论:

首先,你不能使用@Html.ActionLink(..)作为'按钮(这些按钮在服务器端渲染,你不知道那时所选的ID) - 使用html <button id="edit">Edit</button>。在row.click函数中,测试所选行的数量并根据需要启用/禁用按钮

var selectedRows = $(this).closest('tbody').children('tr')
  .filter('.selected').length;
if (selectedRows = 1) {
  // enable edit and details buttons
} else {
  // disable edit and details buttons
}

然后在每个按钮的点击事件中(显示编辑按钮)

$('#edit').click(function() {
  var ID = $(this).find('input[type="hidden"]').val(); // as per first answer 
  window.location.href = '/yourController/edit/' + ID;
  return false;
});

删除按钮会稍微复杂一点 - 一种方法是循环选定的行,获取ID并使用AJAX将ID发布到“删除”操作方法,然后在成功函数中删除行例如,从您的表中(未经测试)

var url = "@Url.Action("Delete")"; // your delete action

$('#delete').click(function() {
  $('#LineTables').children('tbody').children('tr')
    .filter('.selected').each(function) {
    var row = $(this);
    var ID = row.find('input[type="hidden"]').val();
    $.post(url, { ID = ID }, function() {
      row.remove();
    });