dongliu4320
2017-08-10 13:52
浏览 199
已采纳

如何在Jquery Datatable的底部添加Total Cell

I need datatable to be implemented in my project. I wanna show total number at the bottom of the table like below:

enter image description here

I already make default data table like this : enter image description here

This is my code.

<?php
    include "db.php";
    $obj->tglan=$obj->get_hari();
    if (isset($_POST['tanggal2'])) {
        $obj->tglan = $_POST['tanggal2'];

    }
?>


<!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>

        <h3>Daftar SPTA<br><?php echo $obj->tanggal("D, j M Y",$obj->tglan);?></h3>
    </center>
    <left>
        <h5>&nbsp&nbsp&nbspLast refreshed : <?php echo $obj->tanggal("D, j M Y",$obj->tglan)." ".date("H:i:s");?></h5>
    </left>
    <br/>
    <form action="viewLaporanUtama2.php" method="POST">
            <div class="form-group" >
                <label for="tanggal">&nbsp&nbsp&nbspTanggal</label>
                <input type="text" name="tanggal1" class="tanggal" id="myText" required/>
                <input type="submit" name="enter" value="Cari" class="btn btn-info btn-sm">
            </div>
     </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>No SPTA</th>            
                    <th>No Register Induk</th>
                    <th>Nama Petani</th>
                    <th>Gawang/Pos</th>
                    <th>Timbang Bruto</th>
                    <th>Giling</th>
                    <th>Timbang Tarra</th>
                    <th>Netto(kw)</th>
                    <th>Kode Rafraksi</th>
                    <th>Potongan (kw)</th>
                    <th>Netto Akhir (kw)</th>

                </tr>
            </thead>
            <tbody>
                <div id="bagReload">
                    <?php
                        echo $obj->tampilLaporan();
                    ?>
                </div>

            </tbody>
        </table>
    </div>
    </div>
</body>
<script type="text/javascript">
    $(document).ready(function(){
        var tabel = $('.data').DataTable();
    });

</script>
<!-- <script src="js/jquery-3.2.1.min.js"></script> -->
<script src="assets/js/bootstrap.js"></script>
<script src="assets/datepicker/js/bootstrap-datepicker.js"></script>
<script type="text/javascript">
            $(document).ready(function () {
                $('.tanggal').datepicker({
                    format: "yyyy-mm-dd",
                    autoclose:true
                });
            });
</script>
</html>

I've already searched but, there's few reference but I couldn't understand that How I can add Total cell and show at the bottom of datatable?

1条回答 默认 最新

相关推荐 更多相似问题