为什么thead在显示数据时没有显示?

时间:2017-07-21 10:38:58

标签: javascript jquery

我想问一下我的代码.. 我已经制作了jquery服务器端功能,用于将数据从数据库扩展到表中。我使代码首先运行良好但在我尝试添加更多代码以创建thead之前创建tbody代码不会工作..

这是我制作的代码.. 请帮我解决这个问题



// JavaScript Document

$(document).ready(function() {
	$.ajax({
		type:"POST",
		url:"../php/absen/spl_inputselect_data.php",
		success: function(data){
			var list = JSON.parse(data);
			for(var i=0; i < list.length; i++){
				
				var tr = "<tr>";
				theadData = '<tr>' +
     				 '<th>Nama Karyawan</th>' +
      				 '<th>Tanggal</th>' +
	   				 '<th>Bagian</th>' +
      				 '<th>Cost Center</th>' +
      				 '<th>Jam Mulai</th>' +
      				 '<th>Jam Selesai</th>' +
      				 '<th>Status Lembur</th>' +
      				 '<th>Total Jam</th>' +
      				 '<th>Tugas</th>' +
     				 '</tr>';
				tr += "<td>" +list[i]['no']+"</td>";
				tr += "<td>" +list[i]['nama']+"</td>";
				tr += "<td>" +list[i]['tanggal']+"</td>";
				tr += "<td>" +list[i]['jam_mulai']+"</td>";
				tr += "<td>" +list[i]['jam_selesai']+"</td>";
				tr += "<td>" +list[i]['status']+"</td>";
				tr += "<td>" +list[i]['total']+"</td>";
				tr += "<td>" +list[i]['bagian']+"</td>";
				tr += "<td>" +list[i]['cost']+"</td>";
				tr += "<td>" +list[i]['tugas']+"</td>";
				tr += "</tr>";
				$("#check_data tbody").append(tr);
			}
			return false;
		}
	});
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

你应该只将你的头直接附加到桌子上一次而不是在循环中:

$(document).ready(function() {
    $.ajax({
        type:"POST",
        url:"../php/absen/spl_inputselect_data.php",
        success: function(data){
            var list = JSON.parse(data);

            if(list.length > 0)
           {
            $("#check_data thead").html('<tr>' +
                     '<th>Nama Karyawan</th>' +
                     '<th>Tanggal</th>' +
                     '<th>Bagian</th>' +
                     '<th>Cost Center</th>' +
                     '<th>Jam Mulai</th>' +
                     '<th>Jam Selesai</th>' +
                     '<th>Status Lembur</th>' +
                     '<th>Total Jam</th>' +
                     '<th>Tugas</th>' +
                     '</tr>');

            for(var i=0; i < list.length; i++){

                var tr = "<tr>";

                tr += "<td>" +list[i]['no']+"</td>";
                tr += "<td>" +list[i]['nama']+"</td>";
                tr += "<td>" +list[i]['tanggal']+"</td>";
                tr += "<td>" +list[i]['jam_mulai']+"</td>";
                tr += "<td>" +list[i]['jam_selesai']+"</td>";
                tr += "<td>" +list[i]['status']+"</td>";
                tr += "<td>" +list[i]['total']+"</td>";
                tr += "<td>" +list[i]['bagian']+"</td>";
                tr += "<td>" +list[i]['cost']+"</td>";
                tr += "<td>" +list[i]['tugas']+"</td>";
                tr += "</tr>";
                $("#check_data tbody").append(tr);
            }

            }
            return false;
        }
    });
});