如何重新加载数据表?

时间:2017-06-04 13:54:21

标签: php jquery arrays ajax datatables

我制作了一个需要数据表的项目,我已经完成了。但是现在我需要在输入新参数时重新加载数据表以显示新记录。

这是我在输入ID之前第一次加载:

这是在我输入ID:

之后

enter image description here

我需要将数据表中的记录更改为新ID,而无需重新加载页面(只是数据表)

但数据表上方显示的新记录。

这是我的index.php

<?php
include "db.php";
?>

<!DOCTYPE html>
<html>
<head>

<script type="text/javascript" src="assets/DataTables/media/js/jquery.js"></script>
<script type="text/javascript" src="assets/DataTables/media/js/jquery.dataTables.js"></script>
<link rel="stylesheet" type="text/css" href="assets/css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="assets/DataTables/media/css/jquery.dataTables.css">
<link rel="stylesheet" type="text/css" href="assets/DataTables/media/css/dataTables.bootstrap.css">
<link rel="stylesheet" href="assets/css/bootstrap.min.css"/>
<link rel="stylesheet" href="assets/datepicker/css/bootstrap-datepicker3.css"/>
</head>
<body>
    <center>

        <h1>Tabel SPTA<br><?php echo $obj->get_hari();
                            echo "<br>".$obj->kd = 'AA002';?></h1>
    </center>
    <br/>
    <br/>
    <form>
        <input type="text" id="id" placeholder="Enter Your ID .."/><br/>
        <input type="button" value="Submit" onclick="post();" ><br/>
    </form>
    <div class="container-fluid">
        <div class="table-responsive">
        <table border = '0' class="table table-striped table-bordered data" id="tabelSpta">
            <thead>
                <tr>
                    <th>No.</th>            
                    <th>Kode_KT</th>
                    <th>Nama_KT</th>

                </tr>
            </thead>
            <tbody>
                <div id="ganti">
                    <?php $obj->tampil_data($obj->kd);          ?>  
                </div>

            </tbody>
        </table>
    </div>
    </div>
    <script type="text/javascript">

         function post() {

            var id = $('#id').val();


            $.post('db.php',{postid :id},
                function(data){
                     document.getElementById("ganti").innerHTML = data;
                });
         }
    </script>
</body>
<script type="text/javascript">
    $(document).ready(function(){
        var tabel = $('.data').DataTable();
    });
</script>
<script src="assets/datepicker/js/bootstrap.js"></script>
<script src="assets/datepicker/js/bootstrap-datepicker.js"></script>
<script type="text/javascript">   
$(document).ready(function () {
                $('.tanggal').datepicker({
                    format: "dd-mm-yyyy",
                    autoclose:true
                });
            });
</script>

    </html>

这是我的db.php

<?php
    class x{
        function koneksi(){
            $serverName = "DESKTOP-49HH41E\SA";
            $conn = new PDO("sqlsrv:server=$serverName; Database=tebu", "sa", "sa12345");

            return $conn;
        }

        function get_hari(){
            date_default_timezone_set('Asia/Jakarta');
            return date("j F Y G:i:s");
        }

        function KueriSql($id){
            $query = "SELECT TOP 1000  * FROM [dbo].[vM_KEL] 
                        WHERE KD_KT ='".$id."'";

            $stmt = $this->koneksi()->prepare($query);
            $stmt->execute();

            $hasil = $stmt->fetchAll();
            return $hasil;
        }

        public $arr = array();
        public $arrX=0;
        public $kd;

        function tampil_kueri($id){


            foreach ($this->KueriSql($id) as $row) {

                $this->arr[$this->arrX][0] = $this->arrX;
                $this->arr[$this->arrX][1] = $row['KD_KT'];
                $this->arr[$this->arrX][2] = $row['KETUA'];
                $this->arrX++;
            }
        }
        function tampil_data($id){
            $this->tampil_kueri($id);
            for ($baris=0; $baris < $this->arrX; $baris++) { 
                                echo "<tr>";

                            for ($kolom=0; $kolom < 3; $kolom++) { 
                                echo "<td>".$this->arr[$baris][$kolom]."</td>";
                            }
                            echo "</tr>";
                        }   
        }
    }

    $obj = new x();

    $id='';
    if (isset($_POST['postid'])) {
        $id = $_POST['postid'];

        $obj->tampil_data($id);
    }else{
        $obj->tampil_data($id);
    }
?>

0 个答案:

没有答案