Datatables没有显示详细的按钮
我试图在我的网上使用数据表,但是当我在网上添加所有东西后,它不显示像我看到的模板那样的东西。 这是模板 这是我得到 Datatables没有显示详细的按钮
的事情,我的意思是我无法看到的加号按钮,这样我可以不看产品的详细信息。 此按钮只显示当我让浏览器变得这样小,但我需要,即使在浏览器较大,如在模板
你有什么想法,请帮助? 这是我遵循模板: https://datatables.net/extensions/responsive/examples/display-types/foundation-modal.html 这是我的脚本:
$(document).ready(function() {
$('#example').DataTable({
responsive: {
details: {
display: $.fn.dataTable.Responsive.display.modal({
header: function (row) {
var data = row.data();
return 'Details for '+data[0]+' '+data[1];
}
}),
renderer: function (api, rowIdx, columns) {
var data = $.map(columns, function (col, i) {
return '<tr>'+
'<td>'+col.title+':'+'</td> '+
'<td>'+col.data+'</td>'+
'</tr>';
}).join('');
return $('<table width="100%"/>').append(data);
}
}
}
});
});
也许不是关于“javascript”的原因。你可以通过比较你的两个图像来检查你的html或css,你的frame结构应该有一些问题;当浏览器窗口较大时,你可以f12看到那些代码存在:
table.dataTable.dtr-inline.collapsed>tbody>tr>th:first-child:before {
top: 8px;
left: 4px;
height: 16px;
width: 16px;
display: block;
position: absolute;
color: white;
border: 2px solid white;
border-radius: 16px;
box-shadow: 0 0 3px #444;
box-sizing: content-box;
font-family: 'Courier New', Courier, monospace;
text-indent: 4px;
line-height: 16px;
content: '+';
background-color: #008CBA;
}
你的意思是说,我必须把我的代码放在一个div中,并通过css使该div的大小正确吗? –
不,因为你使用数据表,这些CSS包含你的introduction.eg:"https://cdn.datatables.net/responsive/2.0.0/css/responsive.foundation.min.css",你只需要“f12 “检查这些元素是否存在。 – Anan
它不存在于我的代码中,或者我可以通过它将css链接到在线页面 –
对于任何人仍然在2018
发现这一点,我发现了问题,与没有出现我的“加号”按钮(当一个反应灵敏,移动视图)是因为他们被附加到行的“第一个孩子”,所以如果除了第一行以外的行被给予响应优先级而不是该行,则该按钮随之消失。
请帮帮我! –
你必须显示你的代码 –
我确实添加了我的脚本,你能帮助我吗? –