在从MySQL数据库获取数据之前隐藏数据表

Question

我正在制作一个网站，在那里我们可以从MySQL获取数据，并在表格中显示。我将datatable代码用于具有分页和搜索选项的响应表。当我们打开页面时，表格仍然是空的，当我们输入任何单词并按回车键时，数据就会被提取到表格中。我想在获取数据之前隐藏这个表，因为输入搜索词会让访问者感到困惑。请帮我解决这个问题。请看用红色标记圈出的表格，我想在搜索前删除，并仅在点击搜索按钮后显示此表格中的数据。

​

​

Answer 1

在初始化表之后添加以下代码

if ($(".dataTables_empty").length) {
$(".dataTables_wrapper").hide(); }

我这样做是为了解决这个问题。

<script type="text/javascript"> $(document).ready(function() {
$('#example').DataTable(); if ($(".dataTables_empty").length) { $(".dataTables_wrapper").hide();} } ); </script>

Answer 2

嗨，我的朋友，试着这样做：

<div class="table-responsive" id="yourInputSearchValue" style="display:none">
<table class="display dataTable" id="exampleTable"  >
                                //Your columns here
                               </table>
                                 </div>

Javascript：

$('#yourSubmit').on('click',function() {
console.log($('#yourInputSearchValue').val());
id = $.trim($('#yourInputSearchValue').val().replace(/\s+/g, ' '));
console.log(id);
$('#theDivthatContainsTheTable').hide();
exampleTable =$('#exampleTable').DataTable();
if ($.fn.DataTable.isDataTable("#exampleTable")) {
exampleTable.destroy();
$('#exampleTable tbody').remove();
}//this help when you search again
});

希望能有所帮助