html 是否有设置来停止在DataTable中显示“No data available in table”?

ccrfmcuu  于 2023-05-15  发布在  其他
关注(0)|答案(5)|浏览(219)

最初我的表没有数据,我得到“表中没有可用数据”,这是预期的功能。
我想有没有文本或行创建,因为我将通过 AJAX 填充表取决于用户的行动。
是否有停止在表中显示此行的设置?我好像找不到这段代码可以工作,但第一行显示“表中无可用数据”。下面是jQuery代码:

$.ajax({
    type: 'GET',
    url: '/Home/postInformationofConferenceTitle',
    dataType: "JSON",
    success: function (data) {

        $.post("/Home/selectRooms", { xtitle: data.xglobalTitle }, function (data) {

            var ndx = 0;
            $.each(data.xroom_name, function (key, value) {

                var Xroom_name = data.xroom_name[ndx];
                var Xroom_plan = data.xroom_plan[ndx];

                var column =
                  ('<tr>' +
                    '<td>' +
                    '<div class="img-container">' +
                    '<img src="../../assets/img/room-plan/' + Xroom_plan + '" alt="..." id="imgsrc">' +
                    '</div>' +
                    '</td>' +
                    '<td id="imgname">' + Xroom_name + '</td>' +
                    '<td class="text-right">' +
                    '<a href="#" class="btn btn-simple btn-warning btn-icon edit" data-toggle="modal" data-target="#myModal"><i class="fa fa-edit"></i></a>' +
                    '<a href="#" class="btn btn-simple btn-danger btn-icon remove" ><i class="fa fa-times"></i></a>' +
                    '</td>' +
                    '</tr>');

                document.getElementById('colmn').innerHTML = document.getElementById('colmn').innerHTML + column;

                ndx++;

            });

        });

    }
})
gcuhipw9

gcuhipw91#

我猜您可能正在查看datatables的语言设置。

language : {
        "zeroRecords": " "             
    },

(Note“”之间的空间。(这是一个黑客,但发现它现在很有用。

$(document).ready(function () {

	var serverData = [
	]
	var table = $('#example').DataTable({
   language : {
            "zeroRecords": " "             
        },
		data: serverData,
		columns: [
			{ data: "name" },
			{ data: "age" },
			{ data: "isActive" },
			{ data: "friends" },
		],
		'columnDefs': [{
			'targets': 2,
			'render': function (data, type, full, meta) {
				let checked = ''
				if (data) {
					return '<input type="checkbox" checked / >';
				}
				else {
					return '<input type="checkbox"  / >';
				}
				return data;
			}
		},
		{
			'targets': 3,
			"render": function (data, type, full, meta) {
				var selectInitial = "<select>";
        var selectClosing = "</select>";
        var options = '';
				$.each(data, function (key, value) {
					options = options+"<option value="+value.id+">"+value.name+"</option>";
				});
				return selectInitial+options+selectClosing;
			}
		}
		],
	});

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<script src='https://cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js'></script><link rel='stylesheet prefetch' href='https://cdn.datatables.net/1.10.9/css/jquery.dataTables.css'>

<table id="example" class="display" width="100%" cellspacing="0">
        <thead>
            <tr>
                <th>name</th>
                <th>age</th>
                <th>isActive</th>
                <th>friends</th>
                 
            </tr>
        </thead>
    </table>
np8igboo

np8igboo2#

对我很有效。

var someTableDT = $("#some-table").on("draw.dt", function () {
    $(this).find(".dataTables_empty").parents('tbody').empty();
}).DataTable(/*init object*/);
xu3bshqb

xu3bshqb3#

下面为我工作:

$(document).ready(function () {
        $("#TABLE_ID").DataTable();      
        $(".dataTables_empty").empty();
    });
bfhwhh0e

bfhwhh0e4#

下一个CSS为我工作,完全隐藏该块(不仅删除文本):

.dataTables_empty
{
    display:none;
}
nbysray5

nbysray55#

$('#table').dataTable({
    //initialization params as usual
    fnInitComplete: function () {
        if ($(this).find(".dataTables_empty").length == 1) {
            $(this).parent().hide();
        }
    }
});

只有在没有数据情况下才会隐藏。

相关问题