Populate / Create a second datatable from the results of a different table
Populate / Create a second datatable from the results of a different table
Hi there...
Wondering if anyone can help. I am new to AJAX and JQUERY but I am getting there.... Question. I want to display teh results of one data set with a Datable (Did that one already :) )...but then, I want to select one of the results, then populate a second table belowit with the detail of that record. For example, think of an oder... the first table displays all the orders (High level) then when you click on an order number, the second table on the pages shows the products that were in that order.
I will continue to search, but havent exaclty found anything yet that resembles this...
Thanks!!!
Wondering if anyone can help. I am new to AJAX and JQUERY but I am getting there.... Question. I want to display teh results of one data set with a Datable (Did that one already :) )...but then, I want to select one of the results, then populate a second table belowit with the detail of that record. For example, think of an oder... the first table displays all the orders (High level) then when you click on an order number, the second table on the pages shows the products that were in that order.
I will continue to search, but havent exaclty found anything yet that resembles this...
Thanks!!!
This discussion has been closed.
Replies
based on this order number, your ajax would query the database and get data for the 2nd table.
probably easiest way to implement would be to use fnFilter(ordernum, ordercolnum) for that 2nd table
in pseudo-code:
[code]
when user clicks on row in table 1,
1. get order number from some column in that row in table 1
2. call oTable2.fnFilter(ordernum, ordercolnum) where ordercolnum is the column in table 2 that contains the order number for each of the products in the order
3. magic. DataTables does the rest
[/code]
'oerdernum' in your above example would be the value passed from the first oTable, or is the name of the column in thefirst one? Im not sure exaclty how to pass ordernum, do I just implement one of the tables with a callback?
Im not exactly sure how to link the 2 tables also.. I understand the concept but syntax-wise...
would oTable2.fnFilter be in oTable1, or is that in the oTable2 definition?
Here is that I am thinking you are saying:
DEFINE oTABLE1
- oTable2.fnFilter(ordernum, ordercolnum)
-
Then
DEFINE oTable2
There isnt an example of this somewhere is there?
it sounds like they will be completely different tables in the database as well.
table 1 lists all orders
table 2 allows you to list all parts of an order (all rows in table 2 that have a reference in some field to an order number)
---
the call to oTable2.fnFilter() would be in whatever handler you are using to detect the user clicking on a row in oTable1. likely it is not specified within the initialization object of table1, but something like:
[code]
$(document).ready( function () {
oTable1 = $('#table1').dataTable(
// ....
);
oTable2 = $('#table2').dataTable(
// ....
);
$('#table1 tbody tr').live('click', function() {
// find the order number (I'm assuming it's in column 0 of every row)
aData = oTable1.fnGetData(this);
sOrder = aData[0];
// filter table 1 with this order number (assuming order number is in col 4 of table 2)
oTable2.fnFilter(sOrder, 4);
})
});[/code]