สอบถามครับมีปัญหาเกี่ยวกับ checkbox ว่าต้องแก้ตรงไหนครับผม

ถาม-ตอบ แนะนำไอเดียว โค้ดตัวอย่าง แนวทาง วิธีแก้ปัญหา สอบถามครับมีปัญหาเกี่ยวกับ checkbox ว่าต้องแก้ตรงไหนครับผม

สอบถามครับมีปัญหาเกี่ยวกับ checkbox ว่าต้องแก้ตรงไหนครับผม

Jakkrit Saengngoenon 27-05-2020 20:28:16

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

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

ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ
User

Pass

Code
เปลี่ยน

จำข้อมูลการล็อกอิน
เข้าระบบอัตโนมัติ

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

ล็อกอินด้วย Line

ล็อกอินด้วย Google

ล็อกอินด้วย Twitter

ล็อกอินด้วย Tiktok

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

<tr>       
                  
                     <td class="borderTable1"><input type="checkbox" name="css_all_check" id="css_all_check" value="check"></td>
                     <td class="borderTable"><input  type="checkbox" class="css_data_item"  name="chkData[]" value="<?php echo $row["id"]; ?>">
                    <br>&nbsp;&nbsp;<?php echo $row["id"]; ?></td>
                      
                  <td class="borderTable"><input type="checkbox"  class="css_data_item"  name="chkData[] " value="<?php  echo $row["customerName"] ;?>">
                      <br>&nbsp;&nbsp;<?php  echo $row["customerName"] ;?></td>
                           
       <td class="borderTable3"><input  id="borIn" type="checkbox"  class="css_data_item"  name="chkData[]" value="<?php  echo $row["companyName"]; ?>">
                        <br>&nbsp;&nbsp;<?php  echo $row["companyName"]; ?></td>
       
             <td class="borderTable"><input type="checkbox" class="css_data_item"  name="chkData[]" value="<?php  echo $row["phoneNumber"]; ?>">
                 <br>&nbsp;&nbsp;<?php  echo $row["phoneNumber"]; ?></td>
             
              <td class="borderTable"><input type="checkbox" class="css_data_item"  name="chkData[]" value="<?php   echo $row["LINEID"]; ?>">
                  <br>&nbsp;&nbsp;<?php   echo $row["LINEID"]; ?></td>
              
               <td class="borderTable"><input type="checkbox" class="css_data_item"  name="chkData[]" value="<?php  echo $row["email"]; ?>">
                   <br>&nbsp;&nbsp;<?php  echo $row["email"]; ?></td>
               
              <td class="borderTable">  <input type="checkbox" class="css_data_item"  name="chkData[]" value="<?php echo $row["address"]; ?>">
                  <br>&nbsp;&nbsp;<?php echo $row["address"]; ?></td>
              
                         <td class="borderTable1"><?php echo "<a href='insert.php?id=$row[0]'>เพิ่ม</a>" ?></td> 
                          <td class="borderTable1"><?php echo "<a href='edit.php?id=$row[0]'>แก้ไข</a>" ?></td> 
       <td class="borderTable1"><?php  echo"<a href='delete.php?id=$row[0]' onclick="return confirm('Do you want to delete this record? !!!')">ลบ</a>"?></td>                             
                           <td class="borderTable1"><input  id="btnPrint"  name="btnSubmit" type="submit" value="ปริ้น"></td>
                      
                         
                      </tr>

Jakkrit Saengngoenon 27-05-2020 20:34

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

คืออยากให้กดปุ่มแถวที่หนึ่งก็เลือกแถวที่หนึ่งทั้งหมด แต่มันไปรวมถึงแถวสองด้วยอะครับ

แล้วพอกดปุ้มตรงแถวสองอย่างเดียว ก็ไม่ขึ้นเลย ต้องแก้ตรงไหนครับ

อยากให้มันเลือกแค่เฉพาะแถวที่กดอะครับ

Jakkrit Saengngoenon 27-05-2020 20:47

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

ถ้าเป็นการเลือก checkbox ทั้งหมดในแถวเดียวกัน ลองดูตัวอย่างโค้ดนี้เป็นแนวทาง

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 
    <title>Document</title> 
    <link rel="stylesheet" href="https://unpkg.com/bootstrap@4.3.1/dist/css/bootstrap.min.css" >
</head>
<body>


<br>
<br>
<br>
<table class="table">
    <tr class="row-check">
        <td width="50">
            <input type="checkbox" class="check-all">
        </td>
        <td width="25">
            <input type="checkbox" class="check-item">
        </td>
        <td width="25">
            <input type="checkbox" class="check-item">
        </td>
        <td width="25">
            <input type="checkbox" class="check-item">
        </td>
    </tr>    
    <tr class="row-check">
        <td width="50">
            <input type="checkbox" class="check-all">
        </td>
        <td width="25">
            <input type="checkbox" class="check-item">
        </td>
        <td width="25">
            <input type="checkbox" class="check-item">
        </td>
        <td width="25">
            <input type="checkbox" class="check-item">
        </td>
    </tr>         
</table>    
 
<script src="https://unpkg.com/jquery@3.3.1/dist/jquery.min.js"></script>
<script src="https://unpkg.com/bootstrap@4.3.1/dist/js/bootstrap.min.js"></script>
<script type="text/javascript">
$(function(){
     $(document.body).on("click",".check-all",function(){
        var checkedVal = $(this).prop("checked"); 
        console.log(checkedVal); 
        // เราจะได้ค่า true หรือ false ของ check all
        console.log($(this).parents("tr.row-check"));
        // จะรู้ว่าเป็นแถวที่ checkbox all อยู่
        console.log($(this).parents("tr.row-check").find(":checkbox.check-item"));
        // จะรู้ว่ามี checkbox ที่ class ชื่อ check-item อยู่กี่ตัว ตัวไหนบ้าง
        $(this).parents("tr.row-check")
        .find(":checkbox.check-item").prop("checked",checkedVal);
        // คำสั่ง jquery เป็นแบบ chain ขึ้ยบรรทัดใหม่ได้  สุดท้าย เรากำหนด property 
        // ให้ checkbox ที่เราต้องการเป็นไปตามค่าที่เลือก เฉพาะแถว
     });    
});
</script>
</body>
</html>

ตัวอย่าง DEMO

ninenik 27-05-2020

ขอบคุณทุกการสนับสนุน

สนับสนุนเว็บไซต์เรา จ่ายด้วย Truemoney Wallet

20 บาท 50 บาท 100 บาท 300 บาท หรือ ระบุจำนวน