Question

我在.Net MVC应用程序中使用了Datatable。目前我已实施以下内容：

表格的第一列是“ID”，其数据是可点击的。
点击数据会将用户重定向到另一个页面。
用户重定向的URL取决于所点击的ID。因此，每一行都有一个唯一的URL。

在此基础上，我有一个条件适用，如下：

还有另一行名为Status。它包含以下值之一：草稿或已保存。
因此，根据草稿的值，决定要重定向的URL。

这是我目前的剧本：

"ajax":
   {
     "url": "/Request/Search/LoadData",
     "type": "POST",
     "datatype": "json",
     "data": function (d) {
       d.obj = searchFilters();
     },
   },
   "columns":
     [
       {
         "data": "RequestNo",
         "render": function (data, type,row, full, meta) {
           if (row.Status == "Draft") {
             return '<a href="/ChopRequest/Request?RequestId=' + data + '">' + data + '</a>';
           } else {
             return '<a href="/ChopRequest/ViewRequest/Index?id=' + data + '">' + data + '</a>';
           }
         }
       }
     ]

因此，在这种情况下，用户唯一的选择是单击第一列中的数据。相反，我希望整个行都可以点击，同时保留上述条件。

谁能告诉我怎样才能实现这个目标？

Answer 1

您可以检测其他单元格中的点击次数，并将浏览器重定向到位于同一行第一列中的链接。

例如：

$('#example').on('click', 'tbody td', function(){
   window.location = $(this).closest('tr').find('td:eq(0) a').attr('href');
});

＆＃13;

$(document).ready(function (){
    var table = $('#example').DataTable();
    
    $('#example').on('click', 'tbody td', function(){
       window.location = $(this).closest('tr').find('td:eq(0) a').attr('href');
    });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdn.datatables.net/r/dt/dt-1.10.9/datatables.min.js"></script>
<link href="https://cdn.datatables.net/r/dt/dt-1.10.9/datatables.min.css" rel="stylesheet"/>
<table id="example" class="display" cellspacing="0" width="100%">
    <thead>
        <tr>
            <th>Name</th>
            <th>Position</th>
            <th>Office</th>
            <th>Age</th>
            <th>Start date</th>
            <th>Salary</th>
        </tr>
    </thead>
    <tfoot>
        <tr>
            <th>Name</th>
            <th>Position</th>
            <th>Office</th>
            <th>Age</th>
            <th>Start date</th>
            <th>Salary</th>
        </tr>
    </tfoot>
    <tbody>
        <tr>
            <td><a href="//www.datatables.net">Tiger Nixon</a></td>
            <td>System Architect</td>
            <td>Edinburgh</td>
            <td>61</td>
            <td>2011/04/25</td>
            <td>$320,800</td>
        </tr>
    </tbody>
</table>

＆＃13;

单击一行必须将页面重定向到另一个URL

1 个答案: