jQWidgets Forums
jQuery UI Widgets › Forums › General Discussions › jqxgrid sorting issue › Reply To: jqxgrid sorting issue
Hello,
Thanks for the quick response.
I have added all require files. This is also happening with Filtering. So just wonder what I am doing wrong!
Since I am following the same trend as your documentation. I have query file which is referring in javascript url: params and on the same php page I have the markup to render the grid.
Here is my full code
<script type='text/javascript' src='http://192.168.0.107/housefax/wp-includes/js/jquery/jquery.js?ver=1.11.0'></script>
<script type='text/javascript' src='http://192.168.0.107/housefax/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.2.1'></script>
<script type='text/javascript' src='http://192.168.0.107/housefax/wp-content/plugins/apolloblake_clients_data/third-party/jqwidgets/jqxcore.js?ver=1.0'></script>
<script type='text/javascript' src='http://192.168.0.107/housefax/wp-content/plugins/apolloblake_clients_data/third-party/jqwidgets/jqxdata.js?ver=1.0'></script>
<script type='text/javascript' src='http://192.168.0.107/housefax/wp-content/plugins/apolloblake_clients_data/third-party/jqwidgets/jqxbuttons.js?ver=1.0'></script>
<script type='text/javascript' src='http://192.168.0.107/housefax/wp-content/plugins/apolloblake_clients_data/third-party/jqwidgets/jqxscrollbar.js?ver=1.0'></script>
<script type='text/javascript' src='http://192.168.0.107/housefax/wp-content/plugins/apolloblake_clients_data/third-party/jqwidgets/jqxmenu.js?ver=1.0'></script>
<script type='text/javascript' src='http://192.168.0.107/housefax/wp-content/plugins/apolloblake_clients_data/third-party/jqwidgets/jqxlistbox.js?ver=1.0'></script>
<script type='text/javascript' src='http://192.168.0.107/housefax/wp-content/plugins/apolloblake_clients_data/third-party/jqwidgets/jqxdropdownlist.js?ver=1.0'></script>
<script type='text/javascript' src='http://192.168.0.107/housefax/wp-content/plugins/apolloblake_clients_data/third-party/jqwidgets/jqxgrid.js?ver=1.0'></script>
<script type='text/javascript' src='http://192.168.0.107/housefax/wp-content/plugins/apolloblake_clients_data/third-party/jqwidgets/jqxgrid.selection.js?ver=1.0'></script>
<script type='text/javascript' src='http://192.168.0.107/housefax/wp-content/plugins/apolloblake_clients_data/third-party/jqwidgets/jqxgrid.columnsresize.js?ver=1.0'></script>
<script type='text/javascript' src='http://192.168.0.107/housefax/wp-content/plugins/apolloblake_clients_data/third-party/jqwidgets/jqxgrid.filter.js.js?ver=1.0'></script>
<script type='text/javascript' src='http://192.168.0.107/housefax/wp-content/plugins/apolloblake_clients_data/third-party/jqwidgets/jqxgrid.sort.js.js?ver=1.0'></script>
<script type='text/javascript' src='http://192.168.0.107/housefax/wp-content/plugins/apolloblake_clients_data/third-party/jqwidgets/jqxgrid.pager.js?ver=1.0'></script>
<script type='text/javascript' src='http://192.168.0.107/housefax/wp-content/plugins/apolloblake_clients_data/third-party/jqwidgets/jqxgrid.grouping.js?ver=1.0'></script>HTML Element
<div class="table-responsive">
<div id="jqxgrid">
</div>
</div>Javascript on the same php page
<script type="text/javascript">
jQuery(document).ready(function() {
var url = '<?php echo abcd_root_url('abcd_core/data_source/data_daily_reports.php'); ?>';
var theme = 'bootstrap';
// prepare the data
var source =
{
datatype: "json",
datafields: [
{name: 'id', type: 'intiger'},
{name: 'date', type: 'date'},
{name: 'chats_init_customer', type: 'intiger'}
],
url: url,
filter: function() {
// update the grid and send a request to the server.
$("#jqxgrid").jqxGrid('updatebounddata');
},
root: 'Rows',
//cache: false,
beforeprocessing: function(data) {
source.totalrecords = data[0].TotalRows;
}
};
var dataAdapter = new jQuery.jqx.dataAdapter(source, {
loadError: function(xhr, status, error) {
alert(error);
}
});
//var dataAdapter = new jQuery.jqx.dataAdapter(source);
jQuery("#jqxgrid").jqxGrid(
{
columnsresize: true,
source: dataAdapter,
width: 1170,
theme: theme,
autoheight: true,
filterable: true,
pageable: true,
virtualmode: true,
//sortable: true,
rendergridrows: function() {
return dataadapter.records;
},
columns: [
{text: 'ID', datafield: 'id'},
{text: 'Date', datafield: 'date'},
{text: 'Chats Init Customer', datafield: 'chats_init_customer'}
]
});
});
</script>Query Code in different file
$pagenum = $_GET['pagenum'];
$pagesize = $_GET['pagesize'];
$start = $pagenum * $pagesize;
$query = "SELECT SQL_CALC_FOUND_ROWS * FROM hf_abcd_daily_report LIMIT $start, $pagesize";
if (isset($_GET['sortdatafield'])) {
$sortfield = $_GET['sortdatafield'];
$sortorder = $_GET['sortorder'];
$result = mysql_query($query) or die("SQL Error 1: " . mysql_error());
$sql = "SELECT FOUND_ROWS() AS <code>found_rows</code>;";
$rows = mysql_query($sql);
$rows = mysql_fetch_assoc($rows);
$total_rows = $rows['found_rows'];
if ($sortfield != NULL) {
if ($sortorder == "desc") {
$query = "SELECT * FROM hf_abcd_daily_report ORDER BY" . " " . $sortfield . " DESC LIMIT $start, $pagesize";
} else if ($sortorder == "asc") {
$query = "SELECT * FROM hf_abcd_daily_report ORDER BY" . " " . $sortfield . " ASC LIMIT $start, $pagesize";
}
$result = mysql_query($query) or die("SQL Error 1: " . mysql_error());
}
} else {
$result = mysql_query($query) or die("SQL Error 1: " . mysql_error());
$sql = "SELECT FOUND_ROWS() AS <code>found_rows</code>;";
$rows = mysql_query($sql);
$rows = mysql_fetch_assoc($rows);
$total_rows = $rows['found_rows'];
}
while ($row = mysql_fetch_array($result, MYSQL_ASSOC))
{
$customers[] = array(
'id' => $row['id'],
'date' => $row['date'],
'chats_init_customer' => $row['chats_init_customer']
);
}
$data[] = array(
'TotalRows' => $total_rows,
'Rows' => $customers
);
echo json_encode($data);I am able to render grid without sorting and filtering
Hope this will helps you to find what I am doing wrong.