gpt4 book ai didi

javascript - 在第一列 DataTables 中禁用行选择

转载 作者:搜寻专家 更新时间:2023-11-01 05:21:32 29 4
gpt4 key购买 nike

我有一个简单的数据表 https://jsfiddle.net/ptwgxpzu/27/

JS:

    var dataSet = [
["data/rennes/", "Rennes", "rennes.map"],
["data/nantes/", "Nantes", "nantes.map"],
["data/tours/", "Tours", "tours.map"],
["data/bordeaux/", "Bordeaux", "bordeaux.map"],
["data/limoges/", "Limoges", "limoges.map"],
["data/troyes/", "Troyes", "troyes.map"]
];


var table = $('#maptable').DataTable({
"data": dataSet,
"paging": false,
"columns": [{
title: "Download"
}, {
title: "Name"
}, {
title: "File Name"
}],

"columnDefs": [{
"targets": [0], // Download
"visible": true,
"searchable": false,
"bSortable": false
}, {
"targets": [1], // Name
"visible": true,
"searchable": true
}, {
"targets": [2], // File name
"visible": true,
"searchable": true
},


],
"order": [
[1, "asc"]
],
"oLanguage": {
"sSearch": ""
},
"aoColumns": [{
"title": '&nbsp;&nbsp;&nbsp;&nbsp;<i class="fa fa-cloud-download white"></i>&nbsp;&nbsp;Download',
"render": function(data, type, full, meta) {
var url = 'http://localhost/';

var mapurl = url + full[0] + full[2],
trackurl = url + full[0] + full[2].replace('map', 'trx');

return '<div class="btn-group">' +
'<button class="btn btn-default btn-xs dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">' +
'<i class="fa fa-cloud-download white"></i> <span class="caret"></span>' +
'</button>' +
'<ul class="dropdown-menu">' +
'<li><a href=' + mapurl + '><i class="fa fa-download"></i>&nbsp;&nbsp;map file</a></li>' +
'<li><a href=' + trackurl + '><i class="fa fa-download"></i>&nbsp;&nbsp;track file</a></li>' +
'</ul>' +
'</div>';
}
}, {
"title": "Name"
}, {
"title": "File name"
}]

});


$('#maptable tbody').delegate( 'tr', 'click', function () {
$(this).toggleClass('selected');

//...

});

HTML:

<body>
<br />
<div class="container">
<table id="maptable" class="table table-bordered" width="100%"></table>
</div>
</body>
  1. 当表格中的行未被选中时,我点击了第一列中的下拉按钮 - 表格中的行变为可选。
  2. And when row in table selected and I click on dropdown button in first column - row in table is becoming deselected

当我选择表中的行时单击下拉按钮时如何避免“取消选择行”的操作,以及当我未选择表中的行时单击下拉按钮时如何避免操作“选定的行”?或者仅在第一列禁用行选择

最佳答案

使用以下代码:

$('#maptable tbody').on('click', 'td:not(:first-child)', function () {
$(this).closest('tr').toggleClass('selected');

//...

});

参见 updated jsFiddle用于代码和演示。

或者,如果您希望允许在第一列中进行选择(单击按钮时除外),则使用以下代码:

$('#maptable tbody').on('click', 'tr', function (e) {
if(!$(e.target).is('button')){
$(this).toggleClass('selected');
}

//...

});

参见 updated jsFiddle用于代码和演示。

关于javascript - 在第一列 DataTables 中禁用行选择,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36219977/

29 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com