อยากได้โค๊ดซ่อนข้อมูลในแต่ละ Cellของตาราง ด้วย Checkbox

ถาม-ตอบ แนะนำไอเดียว โค้ดตัวอย่าง แนวทาง วิธีแก้ปัญหา อยากได้โค๊ดซ่อนข้อมูลในแต่ละ Cellของตาราง ด้วย Checkbox

อยากได้โค๊ดซ่อนข้อมูลในแต่ละ Cellของตาราง ด้วย Checkbox
อยากซ่อนข้อมูล ของแต่ละColumn เมื่อไม่มีการคลิ๊ก Checkbox "ระวัง" ข้อมูลหลังจากแถว ของ "ระวัง" จะถูกซ่อนครับ

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="css/bootstrap1.min.css" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="css/bootstrap-responsive.min.css" rel="stylesheet">
<link rel="stylesheet" href="css/bootstrap.min.css"> 
<title>agreement</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</head>

<body>
<br>

<div class="container">

	<form method="post" action="">

		<table class="table table-bordered">
    		<thead>
      			<tr class="info">
        			<th WIDTH="33%" class="text-center">หวาน</th>
        			<th WIDTH="33%" class="text-center">เค็ม</th>
        			<th WIDTH="33%" class="text-center">ไขมัน</th>
      			</tr>
    		</thead>
    	<tbody>
				<tr>
        			<td style="background-color:#FFEBCD"><input type="checkbox" name="sweet1" value="1">&nbsp;&nbsp;ลดการเติมน้ำตาลเพิ่ม</td>
       				<td style="background-color:#CCFFFF"><input type="checkbox" name="salt1" value="1">&nbsp;&nbsp;ลดการเติมน้ำปลาเพิ่ม</td>
       				<td style="background-color:#CCFF99"><input type="checkbox" name="fat1" value="1">&nbsp;&nbsp;ใช้น้ำมันพืชประกอบอาหาร</td>
      			</tr>
                <tr>
        			<td style="background-color:#FFEBCD"><input type="checkbox" name="sweet2" value="1">&nbsp;&nbsp;ลดข้าวเหนียวลงไม่เกิน มื้อละ 3 ปั้น</td>
       				<td style="background-color:#CCFFFF"><input type="checkbox" name="salt2" value="1">&nbsp;&nbsp;ใช้เกลือ น้ำปลา ซีอิ๊ว ซอสหอยนางรม ซอสถั่วเหลืองให้น้อย</td>
       				<td style="background-color:#CCFF99"><input type="checkbox" name="fat2" value="1">&nbsp;&nbsp;ทานอกไก่ ปลา หมูสันใน</td>
      			</tr>
				<tr>
        			<td style="background-color:#FFEBCD"><input type="checkbox" name="sweet3" value="1">&nbsp;&nbsp;ทานข้าวเจ้าหรือข้าวกล้องไม่เกินวันละ 6 ทัพพี</td>
       				<td style="background-color:#CCFFFF"><input type="checkbox" name="salt3" value="1">&nbsp;&nbsp;เลี่ยงผงชูรส</td>
       				<td style="background-color:#CCFF99"><input type="checkbox" name="fat3" value="1">&nbsp;&nbsp;ทานไข่ได้สัปดาห์ละ 3 ฟอง</td>
      			</tr>
                <tr>
        			<td style="background-color:#FFEBCD"><input type="checkbox" name="sweet4" value="1">&nbsp;&nbsp;สั่งหวานน้อย</td>
       				<td style="background-color:#CCFFFF"><input type="checkbox" name="salt4" value="1">&nbsp;&nbsp;สั่งอาหารเค็มน้อย</td>
       				<td style="background-color:#CCFF99"><input type="checkbox" name="fat4" value="1">&nbsp;&nbsp;ดื่มนมสดไขมัน 0% วันละแก้ว</td>
      			</tr>
				<tr>
        			<td style="background-color:#FFEBCD"><input type="checkbox" name="sweet5" value="1">&nbsp;&nbsp;ทาน ฝรั่ง ชมพู่ แอปเปิ้ล</td>
       				<td style="background-color:#FF9999"><input type="checkbox" name="salt5" value="1">&nbsp;&nbsp;ระวัง</td>
       				<td style="background-color:#CCFF99"><input type="checkbox" name="fat5" value="1">&nbsp;&nbsp;งดเนื้อสัตว์ติดมัน/หนัง</td>
      			</tr>
                <tr>
        			<td style="background-color:#FF9999"><input type="checkbox" name="sweet6" value="1">&nbsp;&nbsp;ระวัง</td>
       				<td style="background-color:#F0FFF0"><input type="checkbox" name="salt6" value="1">&nbsp;&nbsp;ไส้กรอก</td>
       				<td style="background-color:#CCFF99"><input type="checkbox" name="fat6" value="1">&nbsp;&nbsp;ทานอาหาหรนึ่ง ต้ม ตุ๋น อบ ย่าง</td>
      			</tr>                	
				<tr>
        			<td style="background-color:#FFFFCC"><input type="checkbox" name="sweet7" value="1">&nbsp;&nbsp;กาแฟทรีอินวัน</td>
       				<td style="background-color:#F0FFF0"><input type="checkbox" name="salt7" value="1">&nbsp;&nbsp;เบคอน</td>
       				<td style="background-color:#CCFF99"><input type="checkbox" name="fat7" value="1">&nbsp;&nbsp;ทานฝรั่ง ชมพู่ แอปเปิ้ล</td>
      			</tr>
                <tr>
        			<td style="background-color:#FFFFCC" ><input type="checkbox" name="sweet8" value="1">&nbsp;&nbsp;น้ำอัดลม</td>
       				<td style="background-color:#F0FFF0"><input type="checkbox" name="salt8" value="1">&nbsp;&nbsp;หมูยอ</td>
       				<td style="background-color:#FF9999"><input type="checkbox" name="fat8" value="1">&nbsp;&nbsp;ระวัง</td>
      			</tr>
                <tr>
        			<td style="background-color:#FFFFCC"><input type="checkbox" name="sweet9" value="1">&nbsp;&nbsp;ชาเขียว</td>
       				<td style="background-color:#F0FFF0"><input type="checkbox" name="salt9" value="1">&nbsp;&nbsp;กุนเเชียง</td>
       				<td style="background-color:#FFE3EE"><input type="checkbox" name="fat9" value="1">&nbsp;&nbsp;กาแฟทรีอินวัน</td>
      			</tr>

			</tbody>                
		</table>                
	</form>
</div>

<script src="js/bootstrap.min.js"></script>                                                                        
</body>
</html>


Destiny0183 43.249.70.xxx 28-01-2016 09:11:26

คำแนะนำ และการใช้งาน

สมาชิก กรุณา ล็อกอินเข้าระบบ เพื่อตั้งคำถามใหม่ หรือ ตอบคำถาม สมาชิกใหม่ สมัครสมาชิกได้ที่ สมัครสมาชิก


  • ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ
  • เปลี่ยน


    ( หรือ เข้าใช้งานผ่าน Social Login )

 ความคิดเห็นที่ 1


destiny0183 43.249.70.xxx 28-01-2016 09:12
 ความคิดเห็นที่ 2
ลองประยุกต์จากเนื้อหานี้ดู https://www.ninenik.com/forum_view_1842_1.html


ninenik 180.183.52.xxx 28-01-2016






เว็บไซต์ของเราให้บริการเนื้อหาบทความสำหรับนักพัฒนา โดยพึ่งพารายได้เล็กน้อยจากการแสดงโฆษณา โปรดสนับสนุนเว็บไซต์ของเราด้วยการปิดการใช้งานตัวปิดกั้นโฆษณา (Disable Ads Blocker) ขอบคุณครับ