服务器处理

初级的ajax获取数据的案例

demo.html:

<head>
    <meta charset="utf-8">
    <title>datatable</title>
    <link rel="stylesheet" type="text/css" href="jquery.dataTables.css">
    <link rel="stylesheet" href="bootstrap.min.css" type="text/css">
    <link rel="stylesheet" href="https://cdn.datatables.net/1.10.11/css/jquery.dataTables.min.css" type="text/css">
    <link rel="stylesheet" href="https://cdn.datatables.net/buttons/1.1.2/css/buttons.dataTables.min.css" type="text/css">
    <link rel="stylesheet" href="https://cdn.datatables.net/select/1.1.2/css/select.dataTables.min.css" type="text/css">
    <link rel="stylesheet" href="editor.dataTables.min.css" type="text/css">

    <script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
    <script src="https://cdn.datatables.net/1.10.11/js/jquery.dataTables.min.js"></script>
    <style>

    </style>
</head>

<body>
<table id="example" class="display" cellspacing="0" width="100%">
    <thead>
    <tr>
        <th>First name</th>
        <th>Last name</th>
        <th>Position</th>
        <th>Office</th>
        <th>Start date</th>
        <th>Salary</th>
    </tr>
    </thead>
    <tfoot>
    <tr>
        <th>First name</th>
        <th>Last name</th>
        <th>Position</th>
        <th>Office</th>
        <th>Start date</th>
        <th>Salary</th>
    </tr>
    </tfoot>
</table>
<script>
    $(document).ready(function() {
        $('#example').DataTable( {
            "processing": true,
            "serverSide": true,
            "ajax": "ajax.php"
        } );
    } );
</script>

</body>
</html>

##ajax.php

<?php
//$arr = array("sEcho"=>1,"iTotalRecords"=>"57","iTotalDisplayRecords"=>"57","aaData"=>array(array("Gecko","Firefox 1.0","Win 98+ \/ OSX.2+","1.7","A"),array("Gecko","Firefox 1.5","Win 98+ \/ OSX.2+","1.8","A"),array("Gecko","Firefox 2.0","Win 98+ \/ OSX.2+","1.8","A"),array("Gecko","Firefox 3.0","Win 2k+ \/ OSX.3+","1.9","A"),array("Gecko","Camino 1.0","OSX.2+","1.8","A"),array("Gecko","Camino 1.5","OSX.3+","1.8","A"),array("Gecko","Netscape 7.2","Win 95+ \/ Mac OS 8.6-9.2","1.7","A"),array("Gecko","Netscape Browser 8","Win 98SE+","1.7","A"),array("Gecko","Netscape Navigator 9","Win 98+ \/ OSX.2+","1.8","A"),array("Gecko","Mozilla 1.0","Win 95+ \/ OSX.1+","1","A")));

$arr = array(
  "draw"=>1,
  "recordsTotal"=>57,
  "recordsFiltered"=>57,
  "data"=>array(
    array(
      "Airi",
      "Satou",
      "Accountant",
      "Tokyo",
      "28th Nov 08",
      "$162,700"
    ),
    array(
      "Angelica",
      "Ramos",
      "Chief Executive Officer (CEO)",
      "London",
      "9th Oct 09",
      "$1,200,000"
    ),
    array(
      "Ashton",
      "Cox",
      "Junior Technical Author",
      "San Francisco",
      "12th Jan 09",
      "$86,000"
    ),
    array(
      "Bradley",
      "Greer",
      "Software Engineer",
      "London",
      "13th Oct 12",
      "$132,000"
    ),
    array(
      "Brenden",
      "Wagner",
      "Software Engineer",
      "San Francisco",
      "7th Jun 11",
      "$206,850"
    ),
    array(
      "Brielle",
      "Williamson",
      "Integration Specialist",
      "New York",
      "2nd Dec 12",
      "$372,000"
    ),
    array(
      "Bruno",
      "Nash",
      "Software Engineer",
      "London",
      "3rd May 11",
      "$163,500"
    ),
    array(
      "Caesar",
      "Vance",
      "Pre-Sales Support",
      "New York",
      "12th Dec 11",
      "$106,450"
    ),
    array(
      "Cara",
      "Stevens",
      "Sales Assistant",
      "New York",
      "6th Dec 11",
      "$145,600"
    ),
    array(
      "Cedric",
      "Kelly",
      "Senior Javascript Developer",
      "Edinburgh",
      "29th Mar 12",
      "$433,060"
    )
  )
);

echo(json_encode ( $arr));
?>

http://datatables.club/example/data_sources/server_side.html http://datatables.net/examples/data_sources/server_side.html

results matching ""

    No results matching ""