302   4 ขอคำแนะนำครับ



ritikiat


พลังงานการช่วยเหลือ
( Level 1 )

คะแนนขอบคุณจากสมาชิก
( 0 )

ตอบกระทู้ ( 4 )
เขียนบทความ ( 0 )
ถ้าผมอยากจะให้ COLUMN ที่ว่างอยู่ไม่มาโชว์ ทำยังไงครับ คิดไม่ออก TT

Ex. 
โดย: ritikiat เมื่อ: 14 ก.พ. 61 03:07 ให้คะแนนส่งแทนคำขอบคุณ
ความคิดเห็นที่ 1
อ้างอิงความเห็น


ipromise


พลังงานการช่วยเหลือ
( Level 1 )

คะแนนขอบคุณจากสมาชิก
( 5 )

ตอบกระทู้ ( 5 )
เขียนบทความ ( 0 )
ไม่แน่ใจว่า table จะสร้างจาก code แบบไหนคับ ขอตัวอย่าง code สักหน่อยคับ 55555
โดย: ipromise เมื่อ: 14 ก.พ. 61 11:24 ให้คะแนนส่งแทนคำขอบคุณ
ความคิดเห็นที่ 2
อ้างอิงความเห็น


ritikiat


พลังงานการช่วยเหลือ
( Level 1 )

คะแนนขอบคุณจากสมาชิก
( 0 )

ตอบกระทู้ ( 4 )
เขียนบทความ ( 0 )
>>>> ประมาณนี้ครับ <<<<
อาจจะงงๆ หน่อยมือใหม่ครับ
 
<?php
$link = mysqli_connect("localhost","root","");
mysqli_set_charset($link,'utf8');
$sql = "use datamining";
$result = mysqli_query($link,$sql);
$sql = "SELECT * FROM user_item WHERE user_name='user1'";
$result = mysqli_query($link,$sql);

$numrow = mysqli_num_rows($result);
?>

<tr align="center">
    <td>
        <table border="1" cellpadding="1" cellspacing="1" style="width:50%" align="center">
        <tr>
        <td style = "background-color: rgb(146, 178, 172);">item1</td>
        <td style = "background-color: rgb(146, 178, 172);">item2</td>
        <td style = "background-color: rgb(146, 178, 172);">item3</td>
        <td style = "background-color: rgb(146, 178, 172);">item4</td>
        <td style = "background-color: rgb(146, 178, 172);">item5</td>
        <td style = "background-color: rgb(146, 178, 172);">item6</td>
        <td style = "background-color: rgb(146, 178, 172);">item7</td>
        <td style = "background-color: rgb(146, 178, 172);">item8</td>
        <td style = "background-color: rgb(146, 178, 172);">item9</td>
        <td style = "background-color: rgb(146, 178, 172);">item10</td>
        </tr>
    </td>
</tr>

<?php


for($i=1;$i<=$numrow;$i++){
$eachrow = mysqli_fetch_array($result);
?>
    <td> <?php echo $eachrow['item1'];?> </td>
    <td> <?php echo $eachrow['item2'];?> </td>
    <td> <?php echo $eachrow['item3'];?> </td>
    <td> <?php echo $eachrow['item4'];?> </td>
    <td> <?php echo $eachrow['item5'];?> </td>
    <td> <?php echo $eachrow['item6'];?> </td>
    <td> <?php echo $eachrow['item7'];?> </td>
    <td> <?php echo $eachrow['item8'];?> </td>
    <td> <?php echo $eachrow['item9'];?> </td>
    <td> <?php echo $eachrow['item10'];?> </td>
</tr>
<?php

}
?>

</table>
โดย: ritikiat เมื่อ: 14 ก.พ. 61 12:22 ให้คะแนนส่งแทนคำขอบคุณ
ความคิดเห็นที่ 3
อ้างอิงความเห็น


bamossza


พลังงานการช่วยเหลือ
( Level 2 )

คะแนนขอบคุณจากสมาชิก
( 0 )

ตอบกระทู้ ( 97 )
เขียนบทความ ( 27 )
อ้างอิงจากความเห็นที่ 2

 

จากรูปข้างบน การใช้ tag <table> เหมือนจะยังไม่ถูกนะครับ 

ขออธิบายพิ่มเติมเรื่องการใช้ tag <table> นิ๊ดหนึ่งเพื่อเป็นความรู้และเขียนได้ถูกต้อง
 
<!-- 
	tag table จริงๆ แล้วจะประกอบไปด้วย 3 ส่วน ก็คือ หัว(thead), ตัว(tbody), เท้า(tfoot)
	โดยที่เราจะใช้ให้ครบ หรือไม่ครบ หรือไม่ใส่ก็ได้ แล้วแต่สถานการณ์	
	*tfoot ไม่จำเป็นต้องใช้ก็ได้ แต่ส่วนใหญ่มักจะใช้กรณี สรุปผล, สรุปยอดรวม แนวๆ นี้ครับ
		
	รูปแบบ
	-->
<table>
	<thead>
		<tr>
			<th>item1</th>
			<th>item2</th>
			<th>item3</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td>item1</td>
			<td>item2</td>
			<td>item3</td>
		</tr>
	</tbody>
	<tfoot>
		<tr>
			<td>item1</td>
			<td>item2</td>
			<td>item3</td>
		</tr>
	</tfoot>
</table>

จากกระทู้ เราจะใช้ 2 ส่วนก็คือ thead, tbody
 
<table>
	<thead>
		<tr>
			<th>item1</th>
			<th>item2</th>
			<th>item3</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td>item1</td>
			<td>item2</td>
			<td>item3</td>
		</tr>
	</tbody>
</table>

??!! แล้วทีนี้จะเอาข้อมูลจาก php มาวนแสดงผลยังไงหล่ะ
 
<table>
	<thead>
		<tr>
			<th>item1</th>
			<th>item2</th>
			<th>item3</th>
		</tr>
	</thead>
	<tbody>
		<?php
		..
		..
		while($eachrow = mysqli_fetch_array($result)){
		?>
			<tr>
				<td><?php echo $eachrow['item1'];?></td>
				<td><?php echo $eachrow['item2'];?></td>
				<td><?php echo $eachrow['item3'];?></td>
			</tr>
		<?php
		}
		?>
	</tbody>
</table>​

นั่นก็คือเราจะมาวนลูป เฉพาะส่วนของ <tbody>

ทีนี้เรามาดูในสิ่งที่เราต้องการก็คือ Column ที่ไม่มีข้อมูล ไม่ให้แสดงอาจจะต้องใช้เรื่องของ script เข้ามาช่วย
***จริงๆแล้วมันมีหลายวิธีนะ กรณีนี้สมมติว่าใช้ script ช่วย

สร้างไฟล์: test.html
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>คลังความรู้ เพื่อชาวโปรแกรมเมอร์มือใหม่  - BaMossZa.com</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
</head>
<body>
	<table border="1" id="tableA">
		<thead>
			<tr>
				<th class="index-0">item1</th>
				<th class="index-1">item2</th>
				<th class="index-2">item3</th>
			</tr>
		</thead>
		<tbody>
			<tr>
				<td class="index-0">item1</td>
				<td class="index-1"></td>
				<td class="index-2">item3</td>
			</tr>
			<tr>
				<td class="index-0">item1</td>
				<td class="index-1"></td>
				<td class="index-2"></td>
			</tr>
			<tr>
				<td class="index-0"></td>
				<td class="index-1"></td>
				<td class="index-2">item3</td>
			</tr>
		</tbody>
	</table>
	<script src="http://code.jquery.com/jquery-1.12.4.js"></script>
	<script>
	$(function(){
		var $tableHead = $('#tableA thead');
		var $tableBody = $('#tableA tbody');
		var arrData = [];
		var countColumn = $('#tableA thead tr th').length;
		if(countColumn > 0){
			for(var i = 0; i < countColumn; i++){
				arrData.push({columnIndex: i, count: 0});
			}
			var qtyCol = 0;
			$tableBody.find('tr td').each(function(k, v){
			  if(qtyCol < 3){
				if(v.innerHTML != ''){
					arrData[qtyCol].count++;
				}
				qtyCol++;
			  }else{
				qtyCol = 0;
			  }
			});
			for(var j = 0; j < arrData.length; j++){
				if(arrData[j].count == 0){
					$tableHead.find('th.index-'+j).remove();
					$tableBody.find('td.index-'+j).remove();
				}
			}
		}
	});
	</script>
</body>
</html>

ข้อมูลตอนแรก


ผลลัพธ์ที่ได้หลังจากใช้ script ช่วย


สามารถนำไปประยุกต์ต่อยอดกับ php ได้เลยครับ

Demo:  JSFiddle
โดย: bamossza เมื่อ: 14 ก.พ. 61 17:28 ให้คะแนนส่งแทนคำขอบคุณ
ความคิดเห็นที่ 4
อ้างอิงความเห็น


ritikiat


พลังงานการช่วยเหลือ
( Level 1 )

คะแนนขอบคุณจากสมาชิก
( 0 )

ตอบกระทู้ ( 4 )
เขียนบทความ ( 0 )
อ้างอิงจากความเห็นที่ 3



ขอบคุณครับ :D
โดย: ritikiat เมื่อ: 14 ก.พ. 61 18:16 ให้คะแนนส่งแทนคำขอบคุณ

แสดงความเห็น

อัพโหลดรูปภาพ..คลิก *** เพื่อความปลอดภัยในด้านสิทธิ ไม่อนุญาติให้นำลิ้งรูปภาพจากที่อื่นมาแปะ ถ้าพบเจอ ลบกระทู้ ทันที ***
แสดงความเห็น
Back to Top