jQuery Datatable with the ajax Json String
You can integrate jQuery Datatable with the ajax source in following way.
Download Realse Packages
https://datatables.net/download/
Import JS and CSS
<script src="public/js/jquery.dataTables.min.js" type="text/javascript"></script>
<link href="public/css/jquery.dataTables.min.css" rel="stylesheet" type="text/css"/>
HTML
<div class="col-md-12 table-responsive">
<!-- <table id="table" class="table table-bordered table-striped ">-->
<table id="table" class="table table-striped table-hover dt-responsive display nowrap" width="100%" cellspacing="0" >
<thead>
<tr>
<th> Id</th>
<th>Name</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Id</th>
<th> Name</th>
</tr>
</tfoot>
</table>
</div>
js
$(document).ready(function () {
//$('#table').DataTable();
//$('#table').DataTable(
// {
// "pageLength": 100,
// "ajax": "./index.php?controller=LIST&action=getAc",
// "columns": [
// { "data": "ID" },
// { "data": "NAME" },
// ]
// }
//);
});
controller
function getName() {
try {
ini_set('memory_limit', '-1');
$this->LoadModel('name');
$res = $this->model->getNames();
// $res ='"data":'.$res;
//$d = array();
//$d[] = array('data' => $res);
//$json = json_encode($d);
if (count($res) > 0) {
echo '{"data":'.json_encode($res).'}';
}else {
echo '{"data":""}'; //Append data at the beginning of code
}
} catch (Exception $ex) {
echo json_encode(array("ERROR" => " <br>Error(" . $ex->getMessage() . ")"));
}
}
Sample Json
{
"data": [
{
"name": "Tiger Nixon",
"position": "System Architect",
"salary": "$320,800",
"start_date": "2011/04/25",
"office": "Edinburgh",
"extn": "5421"
}
]
}
This will allows basic view .
Comments
Post a Comment