Forgot Password ??

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

	Registered : 109,027

HOME > PHP > PHP Forum > ขอคำแนะนำครับ datatable ใช้กับตัว bootstrap ไม่ได้

ขอคำแนะนำครับ datatable ใช้กับตัว bootstrap ไม่ได้

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

besfreeman

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

ติดปัญหา 2 จุดครับ ช่วยแก้ไขให้หน่อยได้ไหมครับ

Code (PHP)

<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>จัดการปีการศึกษา</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">

////////////////////////////////ใช้กับ bootstrap 4.1.3  ////////////////////////////////

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>  
<script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>  
<script src="https://cdn.datatables.net/1.10.12/js/dataTables.bootstrap.min.js"></script>            
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.12/css/dataTables.bootstrap.min.css" />  

<head>

<?php include('condb.php');?>
<body > 

///////////////////////////////////// ส่วนนี้มีความเหลื่อมล้ำ ///////////////////////////////////////////////
    <div class="container">
        <?php include('navbar.php');?>
            <div class="row" >

            <div class="card bg-dark"  >
                            <a href="year_list.php" class="list-group-item  bg-secondary text-white">จัดการปีการศึกษา</a>
                            <a href="student_list.php" class="list-group-item list-group-item-action ">จัดการรายชื่อนิสิต</a>
                            <a href="parent_list.php" class="list-group-item list-group-item-action ">จัดการรายชื่อผู้ปกครอง</a>
                            <a href="professor_list.php" class="list-group-item list-group-item-action">จัดการรายชื่ออาจารย์</a>
                            <a href="logout.php" class="list-group-item list-group-item-action disabled">ออกจากระบบ</a>
                </div>

                    <div class="col bg-dark" >
                        <div class="card" >
                                <div class="card-header " style="background-color:LightGray;">
                                    จัดการปีการศึกษา
                                </div>
                            <div class="card-body">
                                <a href="add_year.php" class="btn btn-info " > เพิ่มปีการศึกษา </a>
                                <p></p>
                                    <div class="card table-responsive">
                                        <table class="table table-striped table-bordered" id="dataTable" width="100%" cellspacing="0">
                                            <thead>
                                                    <tr style="background-color:LightGray;">
                                                        <th style="text-align:center ">ปีการศึกษา</th>
                                                        <th style="text-align:center">แก้ไข/ลบ</th>
                                                        <th style="text-align:center">จัดการภาคการศึกษา</th>
                                                    </tr>
                                            </thead>
                                            <tbody>
                                                    <?php
                                                        $query = "SELECT * FROM year ORDER BY year_id DESC" or die("Error:" . mysqli_error());
                                                        $result = mysqli_query($con, $query);
                                                        while($row = mysqli_fetch_array($result)) {
                                                            echo "<tr>";
                                                            echo "<td style='text-align:center'>" .$row["year_id"] .  "</td> ";
                                                            echo "<td style='text-align:center'>
                                                                        <a href='edit_student.php?act=edit&ID=$row[0]' class='btn btn-warning btn-xs '>แก้ไข</a> 
                                                                        <a href='delete_student.php?ID=$row[0]' onclick=\"return confirm('ต้องการลบข้อมูลหรือไม่')\" class='btn btn-danger btn-xs'>ลบ</a></td>";
                                                            echo "<td style='text-align:center'><a href='term_list.php?year=$row[0]' class='btn btn-warning btn-xs'>จัดการภาคการศึกษา</td>";
                                                            echo "</tr>";
                                                        }                    
                                                            echo "</table>";
                                                            mysqli_close($con);
                                                    ?>
                                            </tbody>
                                        </table>
                                    </div>
                            </div> 
                        </div>
                    </div> 
                
            </div></div>
</body>
<?php include('footer.php');?>
</html>
 <script>  
 $(document).ready(function(){  
      $('#dataTable').DataTable();  
 });  
 </script>

[/left][/left][/left][/left]

ผิดฟอร์ม

Tag : PHP, HTML, CSS, HTML5, JavaScript

Date : 2020-11-08 00:16:01

By : besfreeman

View : 1667

Reply : 3

No. 1

Chaidhanan

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

13 - 14 เลือกเอาตัวใดตัวหนึ่ง แล้วลองใหม่

แนะนำให้เอา jquery.datatable ออก

อ้ออีกอย่าง bootstrap 4 มันน่าจะใช้ jquery 3+ มากกว่านะ

และลำดับการ วาง script

boostrap.css
datatable.css

jquery 3.js
boostrap4.js
boostrapdatatable.js

ประวัติการแก้ไข
2020-11-08 06:03:03

Date : 2020-11-08 05:54:53

By : Chaidhanan

No. 2

besfreeman

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

ลองตามนี้แล้วฟอร์มกลับมาเป็นปกติ แต่ Datatable ไม่มีครับ หรือผมทำผิด

Code (PHP)

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.12/css/dataTables.bootstrap.min.css" />  

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> 
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
<script src="https://cdn.datatables.net/1.10.12/js/dataTables.bootstrap.min.js"></script>

Date : 2020-11-08 10:31:27

By : besfreeman

No. 3

Chaidhanan

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

วิวซอร์ส ดู html ในส่วนของ tbody ใน table ดูครับ มี error อะไรที่มัน แพล่มออกมาหรือเปล่า
เพราะ datatable จะทำงาน เมื่อ โครงสร้าง ตารางถูกต้อง
ลองเขียนแบบนี้
Code (PHP)

<tbody>
<?php
$query = "SELECT * FROM year ORDER BY year_id DESC" or die("Error:" . mysqli_error());
$result = mysqli_query($con, $query);
while($row = mysqli_fetch_array($result)) {
  $lnk_edit='edit_student.php?act=edit&ID='.$row[0];
  $lnk_del= 'delete_student.php?ID='.$row[0];
?>
<tr>
  <td style="text-align:center"><?=$row["year_id"]?></td>
  <td style="text-align:center">
    <b onclick="href='<?=$lnk_edit?>'" class="btn btn-warning btn-xs ">แก้ไข</b>
    <b onclick="if(confirm('ต้องการลบข้อมูลหรือไม่')){ href='<?=lnk_del?>'}" 
        class='btn btn-danger btn-xs'>ลบ</b>
  </td>
  <td style="text-align:center">
    <a href="term_list.php?year=$row[0]" class="btn btn-warning btn-xs">จัดการภาคการศึกษา</a></td>
</tr>
<?php  
}
mysqli_close($con);
?>
</tbody>

ที่ datatable ไม่ทำงาน เพราะ tag a ไม่ได้ปิด
Tag </table> เกินมาบันทัด 65

ประวัติการแก้ไข
2020-11-08 13:58:39
2020-11-08 14:00:02
2020-11-08 14:01:04
2020-11-08 14:02:15

Date : 2020-11-08 13:55:52

By : Chaidhanan

ค้นหาข้อมูล

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

Re : ขอคำแนะนำครับ datatable ใช้กับตัว bootstrap ไม่ได้

รายละเอียด

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

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

Notice

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

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

โดย

อีเมล์

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