Datatable jquery插件无法在php中运行

Question

I am using data-table jquery plugin for displaying table. The site is built using php. I have a guest page ( guests.php ) to display a table. When I run the site sorting and search function disappears and all data appears on same page. I tried changing the file name to ( guests.html ) it worked fine. But I need to run it on php file. The code for displaying data is as follows:

<?php
    $query="SELECT * FROM guests ORDER BY gue_id DESC";
    $result= mysqli_query($con, $query);
    $s = 1;

    if(mysqli_affected_rows($con)!=0)
    {
        while ($row = mysqli_fetch_array($result,MYSQLI_ASSOC)){

            echo "<tr>";
            echo "<td class='a-center'>
            <input type='checkbox' class='tableflat'>
        </td>";
            echo "<td>" .$row['gue_name']. "</td>";
            echo "<td>" .$row['gue_mail']. "</td>";
            echo "<td>" .$row['gue_mob']. "</td>";
            echo "<td>" .$row['ev_name']. "</td>";
            echo "<td>" .$row['gue_ticket_no']. "</td>";
            echo "<td>" .$row['gue_rsvp']. "</td>";
            echo "<td class='last'>
            <a href='#' class='btn btn-info btn-xs'><i class='fa fa-pencil'></i> Edit </a>
            <a href='#' class='btn btn-danger btn-xs'><i class='fa fa-trash-o'></i> Delete </a></td>";

            echo "</tr>";
            $s++;
        }
    }
  ?>

js Script as below

<script src="../assets/js/datatables/js/jquery.dataTables.js"></script>
    <script src="../assets/js/datatables/tools/js/dataTables.tableTools.js"></script>
    <script>
        $(document).ready(function () {
            $('input.tableflat').iCheck({
                checkboxClass: 'icheckbox_flat-green',
                radioClass: 'iradio_flat-green'
            });
        });

        var asInitVals = new Array();
        $(document).ready(function () {
            var oTable = $('#example').dataTable({
                "oLanguage": {
                    "sSearch": "Search all columns:"
                },
                "aoColumnDefs": [
                    {
                        'bSortable': false,
                        'aTargets': [0]
                    } //disables sorting for column one
        ],
                'iDisplayLength': 12,
                "sPaginationType": "full_numbers",
                "dom": 'T<"clear">lfrtip',
                "tableTools": {
                    "sSwfPath": "<?php echo base_url('assets2/js/Datatables/tools/swf/copy_csv_xls_pdf.swf'); ?>"
                }
            });
            $("tfoot input").keyup(function () {
                /* Filter on the column based on the index of this element's parent <th> */
                oTable.fnFilter(this.value, $("tfoot th").index($(this).parent()));
            });
            $("tfoot input").each(function (i) {
                asInitVals[i] = this.value;
            });
            $("tfoot input").focus(function () {
                if (this.className == "search_init") {
                    this.className = "";
                    this.value = "";
                }
            });
            $("tfoot input").blur(function (i) {
                if (this.value == "") {
                    this.className = "search_init";
                    this.value = asInitVals[$("tfoot input").index(this)];
                }
            });
        });
    </script>

Any suggestions what might be the problem.