jQWidgets Forums
jQuery UI Widgets › Forums › Grid › Master Detail – Multiple detail grids
Tagged: jqxgrid, mater detail, mutiple detail grids
This topic contains 0 replies, has 1 voice, and was last updated by mrloopz 12 years ago.
Viewing 1 post (of 1 total)
-
Author
-
Good day,
Really nice tools. Very powerful. Been tinkering around and ran into a road block.
Can somebody please orient me as to the best way to have several detail grids populate based on the row selection of the master grid?
I tried using the same data source for both detail grids. But I cant get the second grid to populate any data even though it will create the right amount of rows.
data.php
<?php#Include the connect.php fileinclude('connect.php');#Connect to the database//connection String$connect = mysql_connect($hostname, $username, $password)or die('Could not connect: ' . mysql_error());//Select The database$bool = mysql_select_db($database, $connect);if ($bool === False){ print "can't find $database";}// get data and store in a json array$query = "SELECT * FROM tri_tripfile order by tri_tri_tripno";if (isset($_GET['customeridz'])){ //$pagenum = $_GET['pagenum']; //$pagesize = $_GET['pagesize']; //$start = $pagenum * $pagesize; $query = "SELECT SQL_CALC_FOUND_ROWS * FROM tru_truck WHERE tru_id='" .$_GET['customeridz'] . "'"; //$query .= " LIMIT $start, $pagesize"; $result = mysql_query($query) or die("SQL Error 1: " . mysql_error()); $sql = "SELECT FOUND_ROWS() AS `found_rows`;"; $rows = mysql_query($sql); $rows = mysql_fetch_assoc($rows); $total_rows = $rows['found_rows']; // get data and store in a json array while ($row = mysql_fetch_array($result, MYSQL_ASSOC)) { $carriers[] = array( 'tru_name' => $row['tru_name'], 'tru_phone' => $row['tru_phone'] ); } $data[] = array( 'TotalRows' => $total_rows, 'Rows' => $carriers ); echo json_encode($data); }else {if (isset($_GET['customerid'])){ //$pagenum = $_GET['pagenum']; //$pagesize = $_GET['pagesize']; //$start = $pagenum * $pagesize; $query = "SELECT SQL_CALC_FOUND_ROWS * FROM fro_fromto WHERE fro_tripno='" .$_GET['customerid'] . "'"; //$query .= " LIMIT $start, $pagesize"; $result = mysql_query($query) or die("SQL Error 1: " . mysql_error()); $sql = "SELECT FOUND_ROWS() AS `found_rows`;"; $rows = mysql_query($sql); $rows = mysql_fetch_assoc($rows); $total_rows = $rows['found_rows']; // get data and store in a json array while ($row = mysql_fetch_array($result, MYSQL_ASSOC)) { $orders[] = array( 'fro_desc' => $row['fro_desc'], 'fro_date' => $row['fro_date'], 'fro_state' => $row['fro_state'], 'fro_city' => $row['fro_city'], 'fro_name' => $row['fro_name'], 'fro_reference' => $row['fro_reference'], 'fro_desc' => $row['fro_desc'], 'fro_reference' => $row['fro_reference'], 'fro_address' => $row['fro_address'], 'fro_phone' => $row['fro_phone'], 'fro_zip' => $row['fro_zip'], 'fro_punum' => $row['fro_punum'], 'fro_boxcount' => $row['fro_boxcount'], 'fro_commodity' => $row['fro_commodity'] ); } $data[] = array( 'TotalRows' => $total_rows, 'Rows' => $orders ); echo json_encode($data); }else{ //$pagenum = $_GET['pagenum']; //$pagesize = $_GET['pagesize']; //$start = $pagenum * $pagesize; $query = "SELECT SQL_CALC_FOUND_ROWS * FROM tri_tripfile order by tri_tripno"; $result = mysql_query($query) or die("SQL Error 1: " . mysql_error()); $sql = "SELECT FOUND_ROWS() AS `found_rows`;"; $rows = mysql_query($sql); $rows = mysql_fetch_assoc($rows); $total_rows = $rows['found_rows']; while ($row = mysql_fetch_array($result, MYSQL_ASSOC)) { $customers[] = array( 'tri_tripno' => $row['tri_tripno'], 'tri_carrierid' => $row['tri_carrierid'], 'tri_driver' => $row['tri_driver'], 'tri_begdate' => $row['tri_begdate'], 'tri_enddate' => $row['tri_enddate'], 'tri_pickup' => $row['tri_pickup'], 'tri_drop' => $row['tri_drop'], 'tri_bill_id' => $row['tri_bill_id'], 'tri_ponum' => $row['tri_ponum'], 'tri_tripstat' => $row['tri_tripstat'] ); } $data[] = array( 'TotalRows' => $total_rows, 'Rows' => $customers ); echo json_encode($data);}}?>
here are the relevant parts of my index.php
<script type="text/javascript"> $(document).ready(function () { // prepare the data var source = { datatype: "json", datafields: [ { name: 'tri_tripno'}, { name: 'tri_carrierid'}, { name: 'tri_driver'}, { name: 'tri_begdate', type: 'date' }, { name: 'tri_enddate', type: 'date' }, { name: 'tri_pickup'}, { name: 'tri_drop'}, { name: 'tri_bill_id'}, { name: 'tri_ponum'}, { name: 'tri_tripstat'}, ], id: 'tri_tripno', url: 'data.php', cache: false, root: 'Rows', }; var datAdapter = new $.jqx.dataAdapter(source); $("#jqxgrid").jqxGrid( { source: datAdapter, theme: 'energyblue', filterable: true, sortable: true, groupable: true, enablebrowserselection: true, width: '100%', height: '96%', rendergridrows: function () { return dataAdapter.records; }, columns: [ { text: 'Trip Number', datafield: 'tri_tripno', width: 50}, { text: 'Carrier', datafield: 'tri_carrierid', width: 100 }, { text: 'Driver', datafield: 'tri_driver', width: 120}, { text: 'Start Date', datafield: 'tri_begdate', cellsformat: 'd', width: 180 }, { text: 'End Date', datafield: 'tri_enddate', cellsformat: 'D', width: 200 }, { text: 'Pickup', datafield: 'tri_pickup', width: 120 }, { text: 'Drop', datafield: 'tri_drop', width: 120}, { text: 'Customer', datafield: 'tri_bill_id', width: 120}, { text: 'PO Number', datafield: 'tri_ponum', width: 80}, { text: 'Status', datafield: 'tri_tripstat', width: 90} ], groups: ['tri_tripstat', 'tri_drop'] }); // init Orders Grid $("#ordersGrid").jqxGrid( { height: '100%', width: '100%', theme: 'energyblue', rendergridrows: function (obj) { return []; }, columns: [ { text: 'Description', datafield: 'fro_desc', width: 90 }, { text: 'Date', datafield: 'fro_date', cellsformat: 'D', width: 200 }, { text: 'State', datafield: 'fro_state', width: 50 }, { text: 'City', datafield: 'fro_city', width: 100 }, { text: 'Warehouse', datafield: 'fro_name', width: 120 }, { text: 'ID', datafield: 'fro_reference', width: 90 }, { text: 'Address', datafield: 'fro_address', width: 100 }, { text: 'Telephone', datafield: 'fro_phone', width: 100 }, { text: 'Zip Code', datafield: 'fro_zip', width: 80 }, { text: 'PU Number', datafield: 'fro_punum', width: 100 }, { text: 'Box Count', datafield: 'fro_boxcount', width: 100 }, { text: 'Commodity', datafield: 'fro_commodity', width: 100 } ] }); // init Carriers Grid $("#carriersGrid").jqxGrid( { height: '99%', width: '99%', theme: 'energyblue', rendergridrows: function (obj) { return []; }, columns: [ { text: 'Name', datafield: 'tru_name', width: 90 }, { text: 'Phone', datafield: 'tru_phone', width: 200 }, ] }); $("#jqxgrid").bind('rowselect', function (event) { var row = event.args.rowindex; var id = $("#jqxgrid").jqxGrid('getrowdata', row)['tri_tripno']; var source = { url: 'data.php', dataType: 'json', data: {customerid: id}, datatype: "json", cache: false, datafields: [ { name: 'fro_desc' }, { name: 'fro_date', type: 'date' }, { name: 'fro_state' }, { name: 'fro_city' }, { name: 'fro_name' }, { name: 'fro_reference' }, { name: 'fro_desc' }, { name: 'fro_reference' }, { name: 'fro_address' }, { name: 'fro_phone' }, { name: 'fro_zip' }, { name: 'fro_punum' }, { name: 'fro_boxcount' }, { name: 'fro_commodity' } ], root: 'Rows', }; var source2 = { url: 'data.php', dataType: 'json', data: {customeridz: id}, datatype: "json", cache: false, datafields: [ { name: 'tru_name' }, { name: 'tru_phone' } ], root: 'Rows', }; var adapter = new $.jqx.dataAdapter(source); // initialize jqxGrid $("#ordersGrid").jqxGrid( { source: adapter, }); var d1adapter = new $.jqx.dataAdapter(source); // initialize jqxGrid $("#carriersGrid").jqxGrid( { source: d1adapter, }); }); }); </script>
Any ideas??
Thank you in Advance
-
AuthorPosts
Viewing 1 post (of 1 total)
You must be logged in to reply to this topic.