Forgot Password ??

PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone

	Registered : 109,038

HOME > PHP > PHP Forum > สอบถามเรื่องไฮไลท์สีเมื่อมีการเลือก radio button และ ลบสีเมื่อมีการเลือกข้ออื่น

สอบถามเรื่องไฮไลท์สีเมื่อมีการเลือก radio button และ ลบสีเมื่อมีการเลือกข้ออื่น

เริ่มหัวข้อใหม่

Mister3enz

โพสกระทู้ ( 45 )
บทความ ( 0 )

ตอนนี้เลือกแล้วมีไฮไลท์ขึ้น แต่ติดปัญหาตรง เมื่อมีการเปลี่ยนไปเลือกข้ออื่นสีที่ไฮไลท์ข้อแรกไม่หายไปด้วย

code ที่ทำ Highlight สีครับ

<script type="text/javascript">
$(function(){

    var highlight_bgColor="#59C1BD";     
    $(".css_data_item").click(function(){  
        var parentTR=$(this).parents(".css_tr_data"); 
        var old_bgColor=parentTR.attr("bgcolor");
        old_bgColor=(old_bgColor!=undefined)?old_bgColor:"";
        if($(this).prop("checked")){
            parentTR.css("background-color",highlight_bgColor); 
        }else{
            parentTR.css("background-color",old_bgColor); 
        }
    });
});
</script>

Code ตารางที่มีการทำ radio button)

 print("<form action =\"\" name =\"formcheck\" id =\"formcheck\" method =\"POST\" enctype=\"multipart/form-data\">");
    print("<input type=\"hidden\" name=\"id_data\" value=\"" . $query_data[0]['id_data'] . "\">");
    print("<input type=\"hidden\" name=\"id_emp\" value=\"" . $query_data[0]['id_emp'] . "\">");
    $qusetion = getlist("SELECT * FROM question");
    for ($i = 0; $i < sizeof($qusetion); $i++) {
        $k = $i + 1;
        print("<table class=\"table table-borderless\" align=\"center\" style=\"width:250mm;empty-cells: show;\" border=\"1\">");
        print("<thead");
        print("<tr id=\"radio\" class=\"qusetion font-weight-bold \" style=\"text-align:left;\">");
        print("<td colspan='2' class=\" text-white\"  style=\"background: #07689F;\">");
        print("<input  type=\"hidden\" name=\"qusetion[]\" value=\"" . $qusetion[$i]['qusetion_id'] . "\">$k.&nbsp&nbsp" . $qusetion[$i]['qusetion_name'] . "");
        print("</td>");
        print("</tr>");
        print("</thead>");
        $answer = getlist("SELECT * FROM answer where qusetion_id = '" . $qusetion[$i]['qusetion_id'] . "' ");
        for ($q = 0; $q < sizeof($answer); $q++) {
            print("<tbody>");
            print("<tr class=\"css_tr_data\" style=\"text-align:left; background:#FFFFFF \" bgcolor=\"#FFFFFF\"  >");
            print("<td>");
            print("<input style=\"width:35px;height:35px;\" type=\"radio\"  class=\"css_data_item\"  id=\"answer[" . $answer[$q]['qusetion_id'] . "]\" name=\"answer[" . $answer[$q]['qusetion_id'] . "]\" value=\"" . $answer[$q]['answer_id'] . "\"><span></span");
            print("</td>");
            print("<td>");
            print($answer[$q]['answer_name']);
            print("</td>");
            print("</tr>");
            print("<tbody>");
        }
        print("</table>");
    }
    print("<input type=\"hidden\" name=\"count\" value=\"$q\">");
    print("<br>");
    print("<center>");
    print("<input type=\"submit\" name=\"update\" value=\"บันทึกข้อมูล\"  class=\"btn btn-success btn-xl submit_data\" style='font-size:24px;width:250px;height:100px;'>");
    print("</center>");
    print("<br>");
    print("</form>");

Tag : PHP, CSS, JavaScript, jQuery, Bootstrap Framework

ประวัติการแก้ไข
2022-11-19 14:17:19

Date : 2022-11-19 14:16:59

By : benlovehi5

View : 376

Reply : 2

No. 1

Chaidhanan

โพสกระทู้ ( 9,590 )
บทความ ( 2 )

ใช้ css กำหนดสี
Code (PHP)

<style>
.css_tr_data{ background-color: #dedede; }
.css_tr_data .active{ background-color: #ababab; }
</style>

ใช้ javascript onclick เปลี่ยน class
Code (JavaScript)

<script>
$('input.chk').click(function(){
  $(this).parents('tbody').eq(0).find('tr.active').removeClass('active');
  $(this).parents('tr').eq(0).addClass('active');
});
</script>

ลองเปลี่่ยน algorithm ในการเขียน ดูครับ จะช่วยให้ ไม่หลงไวยกรณ์
Code (PHP)

<form action ="/" name ="formcheck" id ="formcheck" method ="POST" enctype="multipart/form-data">
	<input type="hidden" name="id_data" value="<?=$query_data[0]['id_data']?>">
  <input type="hidden" name="id_emp" value="<?=$query_data[0]['id_emp']?>">
<?php
$qusetion = getlist("SELECT * FROM question");
for ($i = 0; $i < sizeof($qusetion); $i++) {
	$k = $i + 1;
?>
	<table class="table table-borderless" align="center" style="width:250mm;empty-cells: show;" border="1">
		<thead>
			<tr id="radio" class="qusetion font-weight-bold " style="text-align:left;">
				<td colspan='2' class=" text-white"  style="background: #07689F;">"
					<input  type="hidden" name="qusetion[]" value="<?=$qusetion[$i]['qusetion_id']?>" >
					<?=$k?>&nbsp;&nbsp;<?=$qusetion[$i]['qusetion_name']?>
				</td>
			</tr>
		</thead>
		<tbody>
<?php
	$answer = getlist("SELECT * FROM answer where qusetion_id = '" . $qusetion[$i]['qusetion_id'] . "' ");
	for ($q = 0; $q < sizeof($answer); $q++) {
		$id=$answer[$q]['qusetion_id'];
?>
			<tr class="css_tr_data" >
				<td align="left" >
					<input style="width:35px;height:35px;" type="radio" class="css_data_item" id="answer[<?=$id?>]"
						name="answer[<?=$id?>]" value="<?=$id?>]">
						<span></span>
				</td>
				<td><?=$answer[$q]['answer_name']?></td>
		</tr>
<?php 
	}
?>
		<tbody>
	</table>
<?php 
}
?>
	<input type="hidden" name="count" value="$q">
	<br>
	<center>
		<input type="submit" name="update" value="บันทึกข้อมูล" class="btn btn-success btn-xl submit_data"
			style='font-size:24px;width:250px;height:100px;'>
	</center>
	<br>
</form>

ประวัติการแก้ไข
2022-11-19 14:58:56
2022-11-19 14:59:32

Date : 2022-11-19 14:57:42

By : Chaidhanan

No. 2

Chaidhanan

โพสกระทู้ ( 9,590 )
บทความ ( 2 )

อีกอย่าง ลองเปลี่ยน ไปใช้ foreach แทน for ดูครับ ชีวิตจะง่ายขึ้น

Code (PHP)

foreach( $result as $key=>$array){
  //
}

Date : 2022-11-19 15:04:30

By : Chaidhanan

ค้นหาข้อมูล

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

Re : สอบถามเรื่องไฮไลท์สีเมื่อมีการเลือก radio button และ ลบสีเมื่อมีการเลือกข้ออื่น

รายละเอียด

เพื่อความเรียบร้อยของข้อความ ควรจัดรูปแบบให้พอดีกับขนาดของหน้าจอ เพื่อง่ายต่อการอ่านและสบายตา และตรวจสอบภาษาไทยให้ถูกต้อง

อัพโหลดแทรกรูปภาพ

Notice

เพื่อความปลอดภัยของเว็บบอร์ด ไม่อนุญาติให้แทรก แท็ก [img]....[/img] โดยการอัพโหลดไฟล์รูปจากที่อื่น เช่นเว็บไซต์ ฟรีอัพโหลดต่าง ๆ
อัพโหลดแทรกรูปภาพ ให้ใช้บริการอัพโหลดไฟล์ของไทยครีเอท และตัดรูปภาพให้พอดีกับสกรีน เพื่อความโหลดเร็วและไฟล์ไม่ถูกลบทิ้ง

เพื่อความปลอดภัยและการตรวจสอบ กระทู้ที่แทรกไฟล์อัพโหลดไฟล์จากที่อื่น อาจจะถูกลบทิ้ง

โดย

อีเมล์

บวกค่าให้ถูก

<= ตัวเลขฮินดูอารบิก เช่น 123 (หรือล็อกอินเข้าระบบสมาชิกเพื่อไม่ต้องกรอก)

Exchange: นำเข้าสินค้าจากจีน, Taobao, เฟอร์นิเจอร์, ของพรีเมี่ยม, ร่ม, ปากกา, power bank, แฟลชไดร์ฟ, กระบอกน้ำ

Load balance : Server 04