Forgot Password ??

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

	Registered : 109,019

HOME > PHP > PHP Forum > การเชื่อมปุ่มของ Datatable ไปยังหน้า checkuser แต่ละ project ทำอย่างไรครับ

การเชื่อมปุ่มของ Datatable ไปยังหน้า checkuser แต่ละ project ทำอย่างไรครับ

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

jgogo01

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

ตัวอย่างจากเว็บนี้ครับ
ตัวอย่างจากเว็บนี้ครับ >http://data.yst2.go.th/e-cert/index.php
จะเห็นว่า พอเราคลิกปุ่มดาวน์โหลด > มันก็เปิดหน้า download.php แต่ละ Project

ผมได้ลองทำไว้แล้วครับแต่ยังไม่ได้
ได้ลองทำไว้ประมาณนี้ครับ

(หน้าแรก index.php) มี Datatable แสดง Project ทั้งหมด > ไปดึงข้อมูลจาก loadproject.php [แต่ยังทำไม่ได้ครับในส่วนของปุ่ม]
(หน้าดาวน์โหลด download.php) มี Datatable แสดง User > ไปดึงข้อมูลจาก loaduser.php [แต่ยังทำไม่ได้ครับ]

ลิงก์โปรเจคทั้งหมดครับ > https://drive.google.com/drive/folders/1mn-KO3CdVR7pyTdw-3ZuCdba1ailtY4b?usp=sharing

หน้า index.php ครับ

Code (PHP)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>ระบบพิมพ์เกียรติบัตรออนไลน์</title>

    <!-- Bootstrap 5 -->
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" 
    integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6" crossorigin="anonymous">
    <!-- Google Font -->	
    <link href='https://fonts.googleapis.com/css?family=Kanit' rel='stylesheet' type='text/css'>
    <awsome>
    <!-- Awesome Font -->
    <script src="https://kit.fontawesome.com/d662a0dcd0.js" crossorigin="anonymous"></script>
    <!-- Css -->
    <link href="css/main.css" rel="stylesheet">
    <!-- Table -->
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.24/css/dataTables.bootstrap5.min.css">
    <!-- Fav -->
    <link rel="icon" href="img/fav.ico"/>
</head>
<body>

<!-- Nav -->
<nav class="navbar navbar-expand-lg" id="navbar-custom"> 
  <div class="container">
    <a class="navbar-brand" id="text-heading-nav" href="index.php">  
      <img src="img/logo.png" alt="" width="25" height="25"> ระบบพิมพ์เกียรติบัตรออนไลน์</a>

    <!--Nav Toggle-->
    <button class ="nav-toggle-responsive" type="button" data-bs-toggle="collapse" data-bs-target="#nav-main-link" aria-controls="nav-main-link" 
    aria-expanded="false" aria-label="Toggle navigation">
      <i class="fas fa-bars"></i>
    </button>

    <!--Nav Menu-->
        <div class="collapse navbar-collapse" id="nav-main-link">
          <ul class="navbar-nav me-auto mb-2 mb-lg-0 sub-menu">
              <li class="nav-item">
              <a class="d-block" id="text-sub-menu" aria-current="page" href="index.php"> <i class="fas fa-home icon-main"></i> หน้าแรก</a> 
              </li>

              <li class="nav-item">
                <?=(isset($_SESSION['username'])) ? '<a class="d-block" id="text-sub-menu" href="admin.php"> 
                <i class="fas fa-globe-asia icon-main"></i> บริหารจัดการระบบ</a>
                
                <li class="nav-item"> <a class="d-block" id="text-sub-menu" href="logout.php">
                <i class="fas fa-sign-out-alt"></i> ออกจากระบบ</a> </li>'

                  : '<button class="d-block" id="button-login" class="text-sub-menu" herf="#" data-bs-toggle="modal" 
                  data-bs-target="#exampleModal"> <i class="fas fa-lock icon-main"></i> ล็อกอิน </button>
                  ' ;?>
              </li>
            </ul>
        </div>
  </div>
</nav>

<!--- Card Content --->
<div class="container">
  <div class="card mt-4 shadow-sm" >
    <div class="card-header text-white" id= "card-content">
      <h5 class="pt-1"><i class="fas fa-table pe-2"></i>ตารางแสดงโครงการ/กิจกรรม</h5>
    </div>
      <div class="card-body">
        <table id="loadproject" class="table table-bordered" style="width:100%">
          <thead class="table-light">
              <tr>
                  <th>ลำดับที่</th>
                  <th>โครงการ</th>
                  <th>กลุ่ม/งาน</th>
                  <th>วันที่</th>
                  <th>เกียรติบัตร</th>
              </tr>
          </thead>
          <tbody>
              <tr>
                <td> </td>
                <td> </td>
                <td> </td>
                <td> </td>
                <td> </td>
              </tr>
          </tbody>
      </table>
      </div>
    </div>
  </div>
</div>

<!-- Modal Login -->
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <div id="exampleModalLabel"> ล็อกอินเข้าสู่ผู้ดูแลระบบ</div>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">

            <form action="checklogin.php" method="post">
              <div class="mb-3">
                  <label class="form-label" for="username">ผู้ใช้</label>
                  <input class="form-control" type="text" name="username"  placeholder="ชื่อผู้ใช้" required>
              </div>
              <div class="mb-3">
                  <label class="form-label" for="password">รหัสผ่าน</label>
                  <input class="form-control" type="password" name="password" placeholder="รหัสผ่าน" required>
              </div>
              <div class="text-center">
                  <button class="btn btn-primary" type="submit" name="login_user" class="btn">เข้าสู่ระบบ</button>
              </div> 
          </form>
          </div>
      </div>
    </div>
  </div>
</div>

<!-- Footer -->
<Footer class="footer-main fixed-bottom">
<div class="container">
  <div class="row p-3">
    <div class="col d-none d-xxl-block d-xl-block"> <p class= "inline text-start ">Copyright © Library Horwang Pathumthani School All rights reserved.</p> </div>
    <div class="col d-none d-xl-none d-lg-block d-md-block"> <p class= "inline text-start ">Copyright © Library HWP All rights reserved.</p> </div>
    <div class="col d-md-none d-xs-block d-sm-block"> <p class= "inline text-start ">Copyright © Library HWP.</p> </div>

    <div class="col"> <p class= "inline text-end" ><a href="https://facebook.com/jgogo01">By J_NDI P.</a> </p> </div>
</footer>

<!-- Scrpit -->
<!-- Bootstrap 5-->   
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" 
integrity="sha384-JEW9xMcG8R+pH31jmWH6WWP0WintQrMb4s7ZOdauHnUtxwoG2vI5DkLtS3qm9Ekf" crossorigin="anonymous"></script> 


<!-- DataTable-->  
<script type="text/javascript"  src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script type="text/javascript"  src="https://cdn.datatables.net/1.10.24/js/jquery.dataTables.min.js"></script>
<script type="text/javascript"  src="https://cdn.datatables.net/1.10.24/js/dataTables.bootstrap5.min.js"></script> 


<script>
$(document).ready(function() {
    $('#loadproject').DataTable( {
        "processing": true,
        "serverSide": true,
        "ajax": "loadproject.php",
        "language" : {
              "emptyTable": "ไม่มีข้อมูลในตาราง",
              "info": "แสดง _START_ ถึง _END_ จาก _TOTAL_ แถว",
              "infoEmpty": "แสดง 0 ถึง 0 จาก 0 แถว",
              "infoFiltered": "(กรองข้อมูล _MAX_ ทุกแถว)",
              "infoThousands": ",",
              "lengthMenu": "แสดง _MENU_ แถว",
              "loadingRecords": "กำลังโหลดข้อมูล...",
              "processing": "กำลังดำเนินการ...",
              "search": "ค้นหา: ",
              "zeroRecords": "ไม่พบข้อมูล",
              "paginate": {
                  "first": "หน้าแรก",
                  "previous": "ก่อนหน้า",
                  "next": "ถัดไป",
                  "last": "หน้าสุดท้าย"
              },
              "aria": {
                  "sortAscending": ": เปิดใช้งานการเรียงข้อมูลจากน้อยไปมาก",
                  "sortDescending": ": เปิดใช้งานการเรียงข้อมูลจากมากไปน้อย"
              },
              "autoFill": {
                  "cancel": "ยกเลิก",
                  "fill": "กรอกทุกช่องด้วย",
                  "fillHorizontal": "กรอกตามแนวนอน",
                  "fillVertical": "กรอกตามแนวตั้ง",
                  "info": "ข้อมูลเพิ่มเติม"
              },
              "buttons": {
                  "collection": "ชุดข้อมูล",
                  "colvis": "การมองเห็นคอลัมน์",
                  "colvisRestore": "เรียกคืนการมองเห็น",
                  "copy": "คัดลอก",
                  "copyKeys": "กดปุ่ม Ctrl หรือ Command + C เพื่อคัดลอกข้อมูลบนตารางไปยัง Clipboard ที่เครื่องของคุณ"
              }
          },
        "order": [[ 0, "desc" ]]
    } );
} );
</script>

<script>
// รอใส่
</script>

</body>
</html>

หน้า loadproject.php ครับ

Code (PHP)

<?php

$table = 'project';
$primaryKey = 'id';

// Data - Datatable
$columns = array(
	array( 'db' => 'id', 'dt' => 0 ),
	array( 'db' => 'name',  'dt' => 1 ),
	array( 'db' => 'dp',   'dt' => 2 ),
	array(
		'db'        => 'date', 
		'dt'        => 3,
		'formatter' => function( $d, $row ) {
            return date( 'j M Y', strtotime($d));
		}
	),
	array(
        'db'        => 'id',
        'dt'        => 4,
        'formatter' => function( $d, $row ) {
            return '<button onclick="" class="btn btn-success"><i class="pe-1 fas fa-arrow-circle-down"></i> ดาวน์โหลด</button>';
        }
    )
);


// Databate Require
require('connect.php');
$sql_details = array(    
'user' => $user,
'pass' => $passwd,
'db'   => $db,
'host' => $host

);

// DataTable Require
require( 'datatable/ssp.class.php' );

echo json_encode(
	SSP::simple( $_GET, $sql_details, $table, $primaryKey, $columns )
);

?>

Tag : PHP, CSS, HTML5, JavaScript

ประวัติการแก้ไข
2021-04-04 15:41:00
2021-04-04 15:44:33

Date : 2021-04-04 12:46:28

By : jgogo01

View : 1280

Reply : 9

No. 1

mr.v

โพสกระทู้ ( 4,683 )
บทความ ( 8 )

link ใน drive เปิดดูไม่ได้แล้ว
เอาโค้ดส่วนที่มีปัญหามาแปะดีกว่า จะได้มีหลายคนมาช่วยตอบ

ในส่วนของ link download ตามตัวอย่าง มันก็ไม่มีอะไรมาก ใช้การส่ง query string ไปกับ URL อย่างเช่น file.php?id=nnn แบบนี้เป็นต้น
ในหน้าที่รับค่าก็เอา $_GET['id'] มาใช้

การเชื่อมปุ่ม??? ก็ใช้ link ธรรมดาก็ได้ <a href="file.php?id=nnn"> แบบนี้

จากตัวอย่างเขาไม่มี URL เวลาเอาเมาส์ไปชี้เพราะเขาใช้วิธีการดัก event onclick="..." แต่ว่ามันไม่จำเป็นเลย ยังไงข้อมูลนี้ก็เปิดเผยอยู่ดี ยังไม่เห็นเหตุจำเป็นอะไรต้องใช้แบบนั้น ดังนั้นก็ทำลิ้งค์ธรรมดานี่แหละ

ถ้ายังไงเอาโค้ดมาแปะ แล้วอธิบายเพิ่มเติมว่าติดตรงขั้นตอนไหน?

Date : 2021-04-04 15:02:28

By : mr.v

No. 2

jgogo01

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

ตอบความคิดเห็นที่ : 1 เขียนโดย : mr.v เมื่อวันที่ 2021-04-04 15:02:28

รายละเอียดของการตอบ ::

ลิงก์แก้ไขให้แล้วครับ

เดี๋ยวขอลองทำดูอีกทีนะครับ ขอบคุณมากครับ

Date : 2021-04-04 15:36:34

By : jgogo01

No. 3

mr.v

โพสกระทู้ ( 4,683 )
บทความ ( 8 )

Code (PHP)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>ระบบพิมพ์เกียรติบัตรออนไลน์</title>

    <!-- Bootstrap 5 -->
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" 
    integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6" crossorigin="anonymous">
    <!-- Google Font -->	
    <link href='https://fonts.googleapis.com/css?family=Kanit' rel='stylesheet' type='text/css'>
    <awsome>
    <!-- Awesome Font -->
    <script src="https://kit.fontawesome.com/d662a0dcd0.js" crossorigin="anonymous"></script>
    <!-- Css -->
    <link href="css/main.css" rel="stylesheet">
    <!-- Table -->
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.24/css/dataTables.bootstrap5.min.css">
    <!-- Fav -->
    <link rel="icon" href="img/fav.ico"/>
</head>
<body>

<!-- Nav -->
<nav class="navbar navbar-expand-lg" id="navbar-custom"> 
  <div class="container">
    <a class="navbar-brand" id="text-heading-nav" href="index.php">  
      <img src="img/logo.png" alt="" width="25" height="25"> ระบบพิมพ์เกียรติบัตรออนไลน์</a>

    <!--Nav Toggle-->
    <button class ="nav-toggle-responsive" type="button" data-bs-toggle="collapse" data-bs-target="#nav-main-link" aria-controls="nav-main-link" 
    aria-expanded="false" aria-label="Toggle navigation">
      <i class="fas fa-bars"></i>
    </button>

    <!--Nav Menu-->
        <div class="collapse navbar-collapse" id="nav-main-link">
          <ul class="navbar-nav me-auto mb-2 mb-lg-0 sub-menu">
              <li class="nav-item">
              <a class="d-block" id="text-sub-menu" aria-current="page" href="index.php"> <i class="fas fa-home icon-main"></i> หน้าแรก</a> 
              </li>

              <li class="nav-item">
                <?=(isset($_SESSION['username'])) ? '<a class="d-block" id="text-sub-menu" href="admin.php"> 
                <i class="fas fa-globe-asia icon-main"></i> บริหารจัดการระบบ</a>
                
                <li class="nav-item"> <a class="d-block" id="text-sub-menu" href="logout.php">
                <i class="fas fa-sign-out-alt"></i> ออกจากระบบ</a> </li>'

                  : '<button class="d-block" id="button-login" class="text-sub-menu" herf="#" data-bs-toggle="modal" 
                  data-bs-target="#exampleModal"> <i class="fas fa-lock icon-main"></i> ล็อกอิน </button>
                  ' ;?>
              </li>
            </ul>
        </div>
  </div>
</nav>

<!--- Card Content --->
<div class="container">
  <div class="card mt-4 shadow-sm" >
    <div class="card-header text-white" id= "card-content">
      <h5 class="pt-1"><i class="fas fa-table pe-2"></i>ตารางแสดงโครงการ/กิจกรรม</h5>
    </div>
      <div class="card-body">
        <table id="loadproject" class="table table-bordered" style="width:100%">
          <thead class="table-light">
              <tr>
                  <th>ลำดับที่</th>
                  <th>โครงการ</th>
                  <th>กลุ่ม/งาน</th>
                  <th>วันที่</th>
                  <th>เกียรติบัตร</th>
              </tr>
          </thead>
          <tbody>
              <tr>
                <td> </td>
                <td> </td>
                <td> </td>
                <td> </td>
                <td> </td>
              </tr>
          </tbody>
      </table>
      </div>
    </div>
  </div>
</div>

<!-- Modal Login -->
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <div id="exampleModalLabel"> ล็อกอินเข้าสู่ผู้ดูแลระบบ</div>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">

            <form action="checklogin.php" method="post">
              <div class="mb-3">
                  <label class="form-label" for="username">ผู้ใช้</label>
                  <input class="form-control" type="text" name="username"  placeholder="ชื่อผู้ใช้" required>
              </div>
              <div class="mb-3">
                  <label class="form-label" for="password">รหัสผ่าน</label>
                  <input class="form-control" type="password" name="password" placeholder="รหัสผ่าน" required>
              </div>
              <div class="text-center">
                  <button class="btn btn-primary" type="submit" name="login_user" class="btn">เข้าสู่ระบบ</button>
              </div> 
          </form>
          </div>
      </div>
    </div>
  </div>
</div>

<!-- Footer -->
<Footer class="footer-main fixed-bottom">
<div class="container">
  <div class="row p-3">
    <div class="col d-none d-xxl-block d-xl-block"> <p class= "inline text-start ">Copyright © Library Horwang Pathumthani School All rights reserved.</p> </div>
    <div class="col d-none d-xl-none d-lg-block d-md-block"> <p class= "inline text-start ">Copyright © Library HWP All rights reserved.</p> </div>
    <div class="col d-md-none d-xs-block d-sm-block"> <p class= "inline text-start ">Copyright © Library HWP.</p> </div>

    <div class="col"> <p class= "inline text-end" ><a href="https://facebook.com/jgogo01">By J_NDI P.</a> </p> </div>
</footer>

<!-- Scrpit -->
<!-- Bootstrap 5-->   
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" 
integrity="sha384-JEW9xMcG8R+pH31jmWH6WWP0WintQrMb4s7ZOdauHnUtxwoG2vI5DkLtS3qm9Ekf" crossorigin="anonymous"></script> 


<!-- DataTable-->  
<script type="text/javascript"  src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script type="text/javascript"  src="https://cdn.datatables.net/1.10.24/js/jquery.dataTables.min.js"></script>
<script type="text/javascript"  src="https://cdn.datatables.net/1.10.24/js/dataTables.bootstrap5.min.js"></script> 


<script>
$(document).ready(function() {
    $('#loadproject').DataTable( {
        "processing": true,
        "serverSide": true,
        "ajax": "loadproject.php",
        "language" : {
              "emptyTable": "ไม่มีข้อมูลในตาราง",
              "info": "แสดง _START_ ถึง _END_ จาก _TOTAL_ แถว",
              "infoEmpty": "แสดง 0 ถึง 0 จาก 0 แถว",
              "infoFiltered": "(กรองข้อมูล _MAX_ ทุกแถว)",
              "infoThousands": ",",
              "lengthMenu": "แสดง _MENU_ แถว",
              "loadingRecords": "กำลังโหลดข้อมูล...",
              "processing": "กำลังดำเนินการ...",
              "search": "ค้นหา: ",
              "zeroRecords": "ไม่พบข้อมูล",
              "paginate": {
                  "first": "หน้าแรก",
                  "previous": "ก่อนหน้า",
                  "next": "ถัดไป",
                  "last": "หน้าสุดท้าย"
              },
              "aria": {
                  "sortAscending": ": เปิดใช้งานการเรียงข้อมูลจากน้อยไปมาก",
                  "sortDescending": ": เปิดใช้งานการเรียงข้อมูลจากมากไปน้อย"
              },
              "autoFill": {
                  "cancel": "ยกเลิก",
                  "fill": "กรอกทุกช่องด้วย",
                  "fillHorizontal": "กรอกตามแนวนอน",
                  "fillVertical": "กรอกตามแนวตั้ง",
                  "info": "ข้อมูลเพิ่มเติม"
              },
              "buttons": {
                  "collection": "ชุดข้อมูล",
                  "colvis": "การมองเห็นคอลัมน์",
                  "colvisRestore": "เรียกคืนการมองเห็น",
                  "copy": "คัดลอก",
                  "copyKeys": "กดปุ่ม Ctrl หรือ Command + C เพื่อคัดลอกข้อมูลบนตารางไปยัง Clipboard ที่เครื่องของคุณ"
              }
          },
        "order": [[ 0, "desc" ]]
    } );
} );
</script>

<script>
function UserRow(id){
    window.location.href='download.php?id=' + id;
        /*$.ajax({
          url:"loaduser.php",
          method: "POST",
          data: {id:id},
        })*/
          //location.replace('download.php') 
      }

</script>

</body>
</html>

index.php

Code (PHP)

<?php

$table = 'project';
$primaryKey = 'id';

// Data - Datatable
$columns = array(
	array( 'db' => 'id', 'dt' => 0 ),
	array( 'db' => 'name',  'dt' => 1 ),
	array( 'db' => 'dp',   'dt' => 2 ),
	array(
		'db'        => 'date', 
		'dt'        => 3,
		'formatter' => function( $d, $row ) {
            return date( 'j M Y', strtotime($d));
		}
	),
	array(
        'db'        => 'id',
        'dt'        => 4,
        'formatter' => function( $d, $row ) {
            return '<button onclick="UserRow(\'' . $d . '\')" class="btn btn-success"><i class="pe-1 fas fa-arrow-circle-down"></i> ดาวน์โหลด</button>';
        }
    )
);


// Databate Require
require('connect.php');
$sql_details = array(    
'user' => $user,
'pass' => $passwd,
'db'   => $db,
'host' => $host

);

// DataTable Require
require( 'datatable/ssp.class.php' );

echo json_encode(
	SSP::simple( $_GET, $sql_details, $table, $primaryKey, $columns )
);

?>

loadproject.php

Code (PHP)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>ระบบพิมพ์เกียรติบัตรออนไลน์</title>

    <!-- Bootstrap 5 -->
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" 
    integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6" crossorigin="anonymous">
    <!-- Google Font -->	
    <link href='https://fonts.googleapis.com/css?family=Kanit' rel='stylesheet' type='text/css'>
    <awsome>
    <!-- Awesome Font -->
    <script src="https://kit.fontawesome.com/d662a0dcd0.js" crossorigin="anonymous"></script>
    <!-- Css -->
    <link href="css/main.css" rel="stylesheet">
    <!-- Table -->
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.24/css/dataTables.bootstrap5.min.css">
    <!-- Fav -->
    <link rel="icon" href="img/fav.ico"/>
</head>
<body>

<!-- Nav -->
<nav class="navbar navbar-expand-lg" id="navbar-custom"> 
  <div class="container">
    <a class="navbar-brand" id="text-heading-nav" href="index.php">  
      <img src="img/logo.png" alt="" width="25" height="25"> ระบบพิมพ์เกียรติบัตรออนไลน์</a>

    <!--Nav Toggle-->
    <button class ="nav-toggle-responsive" type="button" data-bs-toggle="collapse" data-bs-target="#nav-main-link" aria-controls="nav-main-link" 
    aria-expanded="false" aria-label="Toggle navigation">
      <i class="fas fa-bars"></i>
    </button>

    <!--Nav Menu-->
        <div class="collapse navbar-collapse" id="nav-main-link">
          <ul class="navbar-nav me-auto mb-2 mb-lg-0 sub-menu">
              <li class="nav-item">
              <a class="d-block" id="text-sub-menu" aria-current="page" href="index.php"> <i class="fas fa-home icon-main"></i> หน้าแรก</a> 
              </li>

              <li class="nav-item">
                <?=(isset($_SESSION['username'])) ? '<a class="d-block" id="text-sub-menu" href="admin.php"> 
                <i class="fas fa-globe-asia icon-main"></i> บริหารจัดการระบบ</a>
                
                <li class="nav-item"> <a class="d-block" id="text-sub-menu" href="logout.php">
                <i class="fas fa-sign-out-alt"></i> ออกจากระบบ</a> </li>'

                  : '<button class="d-block" id="button-login" class="text-sub-menu" herf="#" data-bs-toggle="modal" 
                  data-bs-target="#exampleModal"> <i class="fas fa-lock icon-main"></i> ล็อกอิน </button>
                  ' ;?>
              </li>
            </ul>
        </div>
  </div>
</nav>

<!--- Card Content --->
<div class="container">
  <div class="card mt-4 shadow-sm" >
    <div class="card-header text-white" id= "card-content">
      <h5 class="pt-1"><i class="fas fa-table pe-2"></i>ตารางแสดงรายชื่อผู้เข้าร่วมโครงการ/กิจกรรม</h5>
    </div>
      <div class="card-body">
        <table id="user" class="table table-bordered" style="width:100%">
          <thead class="table-light">
              <tr>
                  <th>ลำดับที่</th>
                  <th>คำนำหน้า</th>
                  <th>ชื่อ</th>
                  <th>นามสกุล</th>
                  <th>เกียรติบัตร</th>
              </tr>
          </thead>
          <tbody>
              <tr>
                <td> </td>
                <td> </td>
                <td> </td>
                <td> </td>
                <td> </td>
              </tr>
          </tbody>
      </table>
      </div>
    </div>
  </div>
</div>

<!-- Modal Login -->
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <div id="exampleModalLabel"> ล็อกอินเข้าสู่ผู้ดูแลระบบ</div>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">

            <form action="checklogin.php" method="post">
              <div class="mb-3">
                  <label class="form-label" for="username">ผู้ใช้</label>
                  <input class="form-control" type="text" name="username"  placeholder="ชื่อผู้ใช้" required>
              </div>
              <div class="mb-3">
                  <label class="form-label" for="password">รหัสผ่าน</label>
                  <input class="form-control" type="password" name="password" placeholder="รหัสผ่าน" required>
              </div>
              <div class="text-center">
                  <button class="btn btn-primary" type="submit" name="login_user" class="btn">เข้าสู่ระบบ</button>
              </div> 
          </form>
          </div>
      </div>
    </div>
  </div>
</div>

<!-- Footer -->
<Footer class="footer-main fixed-bottom">
<div class="container">
  <div class="row p-3">
    <div class="col d-none d-xxl-block d-xl-block"> <p class= "inline text-start ">Copyright © Library Horwang Pathumthani School All rights reserved.</p> </div>
    <div class="col d-none d-xl-none d-lg-block d-md-block"> <p class= "inline text-start ">Copyright © Library HWP All rights reserved.</p> </div>
    <div class="col d-md-none d-xs-block d-sm-block"> <p class= "inline text-start ">Copyright © Library HWP.</p> </div>

    <div class="col"> <p class= "inline text-end" ><a href="https://facebook.com/jgogo01">By J_NDI P.</a> </p> </div>
</footer>

<!-- Scrpit -->
<!-- Bootstrap 5-->   
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" 
integrity="sha384-JEW9xMcG8R+pH31jmWH6WWP0WintQrMb4s7ZOdauHnUtxwoG2vI5DkLtS3qm9Ekf" crossorigin="anonymous"></script> 


<!-- DataTable-->  
<script type="text/javascript"  src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script type="text/javascript"  src="https://cdn.datatables.net/1.10.24/js/jquery.dataTables.min.js"></script>
<script type="text/javascript"  src="https://cdn.datatables.net/1.10.24/js/dataTables.bootstrap5.min.js"></script> 


<script>
$(document).ready(function() {
    $('#user').DataTable( {
        "processing": true,
        "serverSide": true,
        "ajax": "loaduser.php?id=<?php echo (isset($_GET['id']) ? $_GET['id'] : ''); ?>",
        "language" : {
              "emptyTable": "ไม่มีข้อมูลในตาราง",
              "info": "แสดง _START_ ถึง _END_ จาก _TOTAL_ แถว",
              "infoEmpty": "แสดง 0 ถึง 0 จาก 0 แถว",
              "infoFiltered": "(กรองข้อมูล _MAX_ ทุกแถว)",
              "infoThousands": ",",
              "lengthMenu": "แสดง _MENU_ แถว",
              "loadingRecords": "กำลังโหลดข้อมูล...",
              "processing": "กำลังดำเนินการ...",
              "search": "ค้นหา: ",
              "zeroRecords": "ไม่พบข้อมูล",
              "paginate": {
                  "first": "หน้าแรก",
                  "previous": "ก่อนหน้า",
                  "next": "ถัดไป",
                  "last": "หน้าสุดท้าย"
              },
              "aria": {
                  "sortAscending": ": เปิดใช้งานการเรียงข้อมูลจากน้อยไปมาก",
                  "sortDescending": ": เปิดใช้งานการเรียงข้อมูลจากมากไปน้อย"
              },
              "autoFill": {
                  "cancel": "ยกเลิก",
                  "fill": "กรอกทุกช่องด้วย",
                  "fillHorizontal": "กรอกตามแนวนอน",
                  "fillVertical": "กรอกตามแนวตั้ง",
                  "info": "ข้อมูลเพิ่มเติม"
              },
              "buttons": {
                  "collection": "ชุดข้อมูล",
                  "colvis": "การมองเห็นคอลัมน์",
                  "colvisRestore": "เรียกคืนการมองเห็น",
                  "copy": "คัดลอก",
                  "copyKeys": "กดปุ่ม Ctrl หรือ Command + C เพื่อคัดลอกข้อมูลบนตารางไปยัง Clipboard ที่เครื่องของคุณ"
              }
          }
    } );
} );
</script>

<script>

</script>

</html>

download.php

Code (PHP)

<?php
require('connect.php');

$table = 'user';
$primaryKey = 'id';


// รับค่า ID จาก index.php
if(isset($_GET['id'])){
    $id = mysqli_real_escape_string($con, $_GET['id']);
} else {
    $id = '';
}
    
    $sql = "SELECT * FROM user WHERE idpj = '$id' ";

$columns = array(
    array('db' => 'id', 'dt' => 0),
	array( 'db' => 'nametitle', 'dt' => 1 ),
    array( 'db' => 'fristname', 'dt' => 2 ),
    array( 'db' => 'lastname', 'dt' => 3 ),
    array( 'db' => 'typereward', 'dt' => 4 ),
    
);

$sql_details = array(    
    'user' => $user,
    'pass' => $passwd,
    'db'   => $db,
    'host' => $host
    
    );


require( 'datatable/ssp.class.php' );

echo json_encode(
	SSP::simple( $_GET, $sql_details, $table, $primaryKey, $columns )
);

?>

loaduser.php

ทดลองดู ไม่รู้ใช่อย่างที่ต้องการไหม?

Date : 2021-04-04 15:38:54

By : mr.v

No. 4

jgogo01

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

ตอบความคิดเห็นที่ : 3 เขียนโดย : mr.v เมื่อวันที่ 2021-04-04 15:38:54

รายละเอียดของการตอบ ::

ขอบคุณมากครับ เดี๋ยวไปลองดูครับ ^^

Date : 2021-04-04 15:43:20

By : jgogo01

No. 5

jgogo01

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

ตอบความคิดเห็นที่ : 3 เขียนโดย : mr.v เมื่อวันที่ 2021-04-04 15:38:54

รายละเอียดของการตอบ ::

ได้แล้วครับผม แต่หน้าดาวน์โหลด ผมอยากให้ แยกโปรเจคในการแสดงผลของแต่ละชื่อ ตามตัวอย่างเลยครับ ต้องทำอย่างไรครับ

หน้า Databate ดังนี้ครับ

Date : 2021-04-04 15:54:19

By : jgogo01

No. 6

Chaidhanan

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

แนะนำ ก่อนที่จะรันงาน รองเรียก request ส่วนที่ต้องการมาดูก่อนว่า ข้อมูลที่ได้มาถูกต้องตามต้องการไหม

เช่น "ajax": "loaduser.php?id=<?php echo (isset($_GET['id']) ? $_GET['id'] : ''); ?>",

ก็ใช้ browser เรียกตรงๆ ก่อนเลย loaduser.php?id=xxxx อะไรก็ว่าไป เพื่อที่จะได้เห็นข้อมูล json จริงๆที่ได้มา ก่อน

แล้วลองหา json viewer เปิดดูว่า field ต่างๆ มันมาถูกต้องไหม

Date : 2021-04-04 15:56:01

By : Chaidhanan

No. 7

jgogo01

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

ตอบความคิดเห็นที่ : 6 เขียนโดย : Chaidhanan เมื่อวันที่ 2021-04-04 15:56:01

รายละเอียดของการตอบ ::

ได้ครับผมขอบคุณครับ ^^

Date : 2021-04-04 16:01:03

By : jgogo01

No. 8

mr.v

โพสกระทู้ ( 4,683 )
บทความ ( 8 )

ตอบความคิดเห็นที่ : 5 เขียนโดย : jgogo01 เมื่อวันที่ 2021-04-04 15:54:19

รายละเอียดของการตอบ ::

ส่วนของไฟล์ loaduser.php บรรทัดล่างเปลี่ยนเป็นอันนี้
Code (PHP)

echo json_encode(
	SSP::complex( $_GET, $sql_details, $table, $primaryKey, $columns, 'idpj=\'' . $id . '\'' )
);

คือเอา user เฉพาะ project ที่เลือก คงใช่นะ

Date : 2021-04-04 16:06:43

By : mr.v

No. 9

jgogo01

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

ตอบความคิดเห็นที่ : 8 เขียนโดย : mr.v เมื่อวันที่ 2021-04-04 16:06:43

รายละเอียดของการตอบ ::

ขอบคุณมากครับ ได้แล้วครับผม

Date : 2021-04-04 16:11:04

By : jgogo01

ค้นหาข้อมูล

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

Re : การเชื่อมปุ่มของ Datatable ไปยังหน้า checkuser แต่ละ project ทำอย่างไรครับ

รายละเอียด

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

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

Notice

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

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

โดย

อีเมล์

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