显示

时间:2017-06-12 05:05:13

标签: javascript jquery wordpress datatables

我有一个wordpress网站没有正确显示我的数据表的按钮。在过去,我必须帮助重新格式化传统的数据表代码,以便在wordpress网站上正确显示,我希望发生的事情是什么这里。

可以在testing.uwsinc.net/dashboardtest上看到包含表格的页面。

其他选项似乎工作正常,但根本没有按钮显示。但是,如果我在我的测试网站上尝试这个,它会显示并完美运行。这可能是一场JS冲突,但我已经脱离了我的专业领域,而且我已经在这里工作了几天而没有运气。非常感谢任何有用的提示,我只需要在此数据表中添加列显示/隐藏选项。

    

<script type="text/javascript"   src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script type="text/javascript"   src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script>
<script type="text/javascript"   src="https://cdn.datatables.net/buttons/1.3.1/js/dataTables.buttons.min.js"></script>
<script type="text/javascript"   src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
<script type="text/javascript"   src="https://cdn.datatables.net/buttons/1.3.1/js/buttons.colVis.min.js"></script>
<script type="text/javascript"   src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.27/build/pdfmake.min.js"></script>
<script type="text/javascript"   src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.27/build/vfs_fonts.js"></script>
<script type="text/javascript"   src="https://cdn.datatables.net/buttons/1.3.1/js/buttons.html5.min.js"></script>
<script type="text/javascript"   src="https://cdn.datatables.net/plug-ins/1.10.15/filtering/row-based/range_dates.js"></script>

</head>
<body>

<label style="font-weight:bold;">Select the table you would like to view:
</label></br>
<select name='tables' id='select-tables'>
<option value="mytable">Survey Test Table</option>
<option value="mytableSurvey">Survey Only</option>
</select>
</br>


<script type="text/javascript">
(function($) {
$(document).ready(function() {

$('#mytable').DataTable({
dom: 'Bfrtip',
  buttons: [
    'copy', 'excel', 'pdf', 'colvis'
]
});


$('#mytableSurvey').DataTable({
dom: 'Bfrtip',
buttons: [
    'copy', 'excel', 'pdf', 'colvis'
]
});
$('.dataTable').wrap('<div class="dataTables_scroll" />');




$(document).on('change' , '#select-tables', function(){
var table = $(this).val();
$('#' + table +'_wrapper').show();
$('[id$="_wrapper"]').not('#' + table +'_wrapper').hide();
});
$("#select-tables").trigger("change");

});
}(jQuery));
</script>

应该如何看待: enter image description here

它看起来如何: enter image description here

0 个答案:

没有答案