master detail jqery jqwidgets orders ไม่ทำงานครับ
<!DOCTYPE html>
<html lang="en">
<head>
<title id='Description'>This example shows how to implement Master-Details binding scenario with two Grids.</title>
<link rel="stylesheet" href="jqwidgets_demo/jqwidgets/styles/jqx.base.css" type="text/css" />
<script type="text/javascript" src="jqwidgets_demo/scripts/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="jqwidgets_demo/jqwidgets/jqxcore.js"></script>
<script type="text/javascript" src="jqwidgets_demo/jqwidgets/jqxbuttons.js"></script>
<script type="text/javascript" src="jqwidgets_demo/jqwidgets/jqxscrollbar.js"></script>
<script type="text/javascript" src="jqwidgets_demo/jqwidgets/jqxmenu.js"></script>
<script type="text/javascript" src="jqwidgets_demo/jqwidgets/jqxgrid.js"></script>
<script type="text/javascript" src="jqwidgets_demo/jqwidgets/jqxgrid.selection.js"></script>
<script type="text/javascript" src="jqwidgets_demo/jqwidgets/jqxgrid.columnsresize.js"></script>
<script type="text/javascript" src="jqwidgets_demo/jqwidgets/jqxgrid.pager.js"></script>
<script type="text/javascript" src="jqwidgets_demo/jqwidgets/jqxlistbox.js"></script>
<script type="text/javascript" src="jqwidgets_demo/jqwidgets/jqxdropdownlist.js"></script>
<script type="text/javascript" src="jqwidgets_demo/jqwidgets/jqxdata.js"></script>
<script type="text/javascript" src="jqwidgets_demo/scripts/gettheme.js"></script>
<script type="text/javascript">
$(document).ready(function () {
var theme = getDemoTheme();
// prepare the data
var source =
{
datatype:'json',
datafields: [
{ name: 'CustomerID' },
{ name: 'CompanyName' },
{ name: 'ContactName' },
{ name: 'ContactTitle' },
{ name: 'Address' },
{ name: 'City' },
{ name: 'Country' }
],
url:'customer.php',
// localdata: []
};
var dataAdapter = new $.jqx.dataAdapter(source);
$("#customersGrid").jqxGrid(
{
width: 670,
height: 250,
source: dataAdapter,
theme: theme,
keyboardnavigation: false,
columns: [
{ text: 'Company Name', datafield: 'CompanyName', width: 250 },
{ text: 'Contact Name', datafield: 'ContactName', width: 150 },
{ text: 'Contact Title', datafield: 'ContactTitle', width: 180 },
{ text: 'City', datafield: 'City', width: 120 },
{ text: 'Country', datafield: 'Country', width: 120 }
]
});
// Orders Grid
// prepare the data
var dataFields = [
{ name: 'CustomerID' },
{ name: 'OrderID' },
{ name: 'OrderDate', type: 'date' },
{ name: 'ShippedDate', type: 'date' },
{ name: 'ShipName' },
{ name: 'ShipCountry' }
];
var source =
{
datatype:'json',
datafields: dataFields,
// localdata: []
url:'orders.php',
};
var dataAdapter = new $.jqx.dataAdapter(source);
dataAdapter.dataBind();
$("#customersGrid").on('rowselect', function (event) {
var customerID = event.args.row.CustomerID;
var records = new Array();
var length = dataAdapter.records.length;
for (var i = 0; i < length; i++) {
var record = dataAdapter.records[i];
if (record.CustomerID == customerID) {
records[records.length] = record;
}
}
var dataSource = {
datafields: dataFields,
datatype: records
}
var adapter = new $.jqx.dataAdapter(dataSource);
// update data source.
$("#ordersGrid").jqxGrid({ source: adapter });
});
$("#ordersGrid").jqxGrid(
{
width: 670,
height: 250,
theme: theme,
keyboardnavigation: false,
columns: [
{ text: 'OrderID', datafield: 'OrderID', width: 100 },
{ text: 'OrderDate', datafield: 'OrderDate', cellsformat: 'd', width: 150 },
{ text: 'Shipped Date', datafield: 'ShippedDate', cellsformat: 'd', width: 150 },
{ text: 'Ship Name', datafield: 'ShipName' }
]
});
$("#customersGrid").jqxGrid('selectrow', 0);
});
</script>
</head>
<body class='default'>
<div id='jqxWidget' style="font-size: 13px; font-family: Verdana; float: left;">
<h3>
Customers</h3>
<div id="customersGrid">
</div>
<h3>
Orders by Customer</h3>
<div id="ordersGrid">
</div>
</div>
</body>
</html>
Tag PHP, jQuery
ประวัติการแก้ไข
Date :
2013-06-09 07:56:07By :
โต้งView :
2383Reply :
5
รันบน Chrome กด F12 คลิกดูที่แท็ป Console ดูว่า error เพราะอะไรครับ
Date :
2013-06-09 11:42:26By :
mangkunzo
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost/master-detail/jqwidgets_demo/jqwidgets/jqwidgets/jqxtooltip.js
Date :
2013-06-09 12:54:02By :
โต้ง
Cannot read property 'CustomerID' of null masterdetails.php:88 เช็คดูครับ
Date :
2013-06-09 12:56:32By :
mangkunzo
ส่ง upfile ให้พี่ช่วยดูหน่อย ครับ
Date :
2013-06-09 13:07:48By :
โต้ง
http://www.mediafire.com/download/56jaq8vq8ajguju/master-detail.rar
Date :
2013-06-09 15:10:10By :
โต้ง
Server 02
Load balance : Server 02
