Sounds like the issue is you want to access data from the previous child (maybe) to build the URL and Ajax data. What is unclear to me is what data you are needing and where is can be found. Is it something you can pass. as parameters when you call createChild()?
} else {
// Open this row
createChild(row, 1, row.data());
tr.addClass("shown");
}
Thanks for your reply.
I recover the data correctly with you example at the level 0. But at the level 1 the data doesn't shows i don't know why (there's no problem on the api url, i get the wanted data on the console).
In other hand, in my previous version of the child tables, I've get the action of the '+' button at the level 2 (if we consider that the first rows are level 0) but it works wierdly on the on the ch2_row.child.isShown() test. And that's why when i click i've the action of an alert but the table disappear and shows the level 1 row closed instead of showing the level 3 table.
if ( ch2_row.child.isShown() ) {
// This row is already open - close it
ch2_row.child.hide();
ch2_tr.removeClass('shown');
console.log("okIsShown");
alert("ok");
}
else {
// Ouverture de la ligne
ch2_row.child( '<table id="tableLevel3">'+ ....
What i need :
- Level 0 : id_user, name, lastname
-- Level 1 : id_user, product1, numberOfProduct (from other api url)
-- -- Level 2 : id_user, product_1_1 (from other api url) + Graph
-- -- -- Level 3 : id_user, product_1_1_1, info (from other api URL)
-- -- Level 2 : id_user, product_1_2
-- Level 1 : id_user, product2, numberOfProduct
- Level 0 : id_user, name, lastname
Thank you for your response. I have tried to correct my first version. i get correctly the click. But the level 3 table and graph aren't displayed.
I have done this, but it seems that i didn't the get the different elements correctly that's why the level 3 table and graph doesn't shows up.
childTable2.on('click', 'td.details-control2', function () {
// '.child_table tbody').off().on('click', 'td.details-control1',
var ch2_tr = $(this).closest('tr');
var ch2_row = childTable.row( ch2_tr );
var ch2_rowData = ch2_row.data();
The ch2_row_child.isShown() is false in if and else statement so i think i didn't get the row correctly.
if ( ch2_row.child.isShown() ) {
// This row is already open - close it
ch2_row.child.hide();
ch2_tr.removeClass('shown');
console.log("okIsShown");
alert(ch2_row.child.isShown());
}
else {
alert(ch2_row.child.isShown());
// table doesn't shown
}
I have also some issues when i try to recover the sevral rowData (c_rowData, etc.) from the different level's tables. I can only recover the first var rowData.
Well, I've done some debug and i found that the rowData of the previous tables works. I mean on the console. So the problem is in the way i try to construct the level 3 :
var ch2_tr = $(this).closest('tr');
var ch2_row = childTable.row( ch2_tr );
var ch2_rowData = ch2_row.data();
Please provide a link to your page or a test case showing the issue. Update the one we've been using if you like. Just use the hard coded Ajax URL so data is fetched. We will need to see the problem to help debug. Just seeing a few lines of code doesn't allow us to see the full context of what is happening.
Another problem my friend, it's that the thead doesn't shows up for the tables of the the level 2 et 3 (if we take the first row as level 0). I don't why and how i can correct that
The modal example you linked to is for the Responsive extension, which while similar, is a different solution. You will need to create a format function to open the child into a modal. I don't have examples but you can probably find something on the forum that discusses open Datatables into a modal to start from.
Another problem my friend, it's that the thead doesn't shows up for the tables of the the level 2 et 3 (if we take the first row as level 0).
Again that would be something we will need to see. Can you provide a link to your page or a test case showing the issue? If you create a test case we can also help with any questions you have for opening the child into a modal.
Thank you for your time and your responses. I could recreate a test case to sho the issue but it will be complicated to maintain properly and will take time, that's why.
I have the modal and my graph with JQuery Modal but i can't modify the width of the modal and it's has a quite bad looking.
But wanted to have the Jquery and Datatables dialog effect. I'm trying to add a button or on the click of the '+' button and then show the dialog with the chart. But on the click of a button that i've at add a the same position of the '+' button, the dialog doesn't shows up.
I will try to give you an test case, if i you couldn't find a solution. But if you have any clue, please feel free to tell me your idea.
Kevin,
I've found a way to get the click of the '+' button and to show the Jquery UI dialog.
it's not perfect but i'm trying to modify the solution. I will let you know if i've a probelm with that.
Thank you once again for your help
Hi,
I need help to keep only one child row opened at a time. That's mean that when we opened a child row detail and we decide to consult another, the child row, which was opened, is closed .
Or if it's possible to keep open all the child when we click on the '+' button. Because it's work for the previous rows of the row where the child row detail is open but for the rows that are after it popups an error message
"DataTables warning: table id=detail - Cannot reinitialise DataTable. For more information about this error, please see http://datatables.net/tn/3"
We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.
Do you know how to have thousands sperated with space, please ?
I've tried
language : {
"thousands":" ' "
}
And also this in the render of the columnDefs : return d.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
And it doesn't works.
And also i want to make a difference between the child rows so i wanted to add background color like in this test case. But it doesn't fit for my uses.
Can you help me with that please?
I believe language.thousands is for the information elements that Datatables displays and not for the table data. You can use a number renderer to format the row data numbers.
want to make a difference between the child rows so i wanted to add background color like in this test case
The link doesn't seem to work. Styling issues are specific to each page. To help we will need a link to your page or a test case showing the issue.
Answers
It's like a detail of content , i mean :
Level 0 : id_user, name, lastname
- Level 1 : id_user, product1, numberOfProduct (from other api url)
- -Level 2 : id_user, product_1_1 (from other api url)
- -Level 2 : id_user, product_1_2
- Level 1 : id_user, product2, numberOfProduct
Level 0 : id_user, name, lastname
And i just need to show the 4 level graph and table
like in this example http://live.datatables.net/fecunaho/69/edit
I couldn't
Sounds like the issue is you want to access data from the previous child (maybe) to build the URL and Ajax data. What is unclear to me is what data you are needing and where is can be found. Is it something you can pass. as parameters when you call
createChild()
?Kevin
Thanks for your reply.
I recover the data correctly with you example at the level 0. But at the level 1 the data doesn't shows i don't know why (there's no problem on the api url, i get the wanted data on the console).
In other hand, in my previous version of the child tables, I've get the action of the '+' button at the level 2 (if we consider that the first rows are level 0) but it works wierdly on the on the ch2_row.child.isShown() test. And that's why when i click i've the action of an alert but the table disappear and shows the level 1 row closed instead of showing the level 3 table.
What i need :
- Level 0 : id_user, name, lastname
-- Level 1 : id_user, product1, numberOfProduct (from other api url)
-- -- Level 2 : id_user, product_1_1 (from other api url) + Graph
-- -- -- Level 3 : id_user, product_1_1_1, info (from other api URL)
-- -- Level 2 : id_user, product_1_2
-- Level 1 : id_user, product2, numberOfProduct
- Level 0 : id_user, name, lastname
Its very hard to say without actually seeing the problem. Take a look at your browser's console to see if there are errors.
Kevin
Thank you for your response. I have tried to correct my first version. i get correctly the click. But the level 3 table and graph aren't displayed.
I have done this, but it seems that i didn't the get the different elements correctly that's why the level 3 table and graph doesn't shows up.
The ch2_row_child.isShown() is false in if and else statement so i think i didn't get the row correctly.
I have also some issues when i try to recover the sevral rowData (c_rowData, etc.) from the different level's tables. I can only recover the first var rowData.
John
Well, I've done some debug and i found that the rowData of the previous tables works. I mean on the console. So the problem is in the way i try to construct the level 3 :
I don't know where is the problem
Please provide a link to your page or a test case showing the issue. Update the one we've been using if you like. Just use the hard coded Ajax URL so data is fetched. We will need to see the problem to help debug. Just seeing a few lines of code doesn't allow us to see the full context of what is happening.
Kevin
Thanks Kevin for the advices. I have found a way to show the tables.
But I couldn't show the properly the graph and the row details in a modal.
Like this : https://datatables.net/extensions/responsive/examples/display-types/jqueryui-modal.html
I don't know why this example didn't work on my app
Another problem my friend, it's that the thead doesn't shows up for the tables of the the level 2 et 3 (if we take the first row as level 0). I don't why and how i can correct that
I want to have this but it doesn't work and i haven't have the '+' boutton.
I don't know. can yopu help me please to make it work.
The modal example you linked to is for the Responsive extension, which while similar, is a different solution. You will need to create a format function to open the child into a modal. I don't have examples but you can probably find something on the forum that discusses open Datatables into a modal to start from.
Again that would be something we will need to see. Can you provide a link to your page or a test case showing the issue? If you create a test case we can also help with any questions you have for opening the child into a modal.
Kevin
Colin's answer in this thread from today might help you with the modal.
Kevin
Thank you for your time and your responses. I could recreate a test case to sho the issue but it will be complicated to maintain properly and will take time, that's why.
I have the modal and my graph with JQuery Modal but i can't modify the width of the modal and it's has a quite bad looking.
But wanted to have the Jquery and Datatables dialog effect. I'm trying to add a button or on the click of the '+' button and then show the dialog with the chart. But on the click of a button that i've at add a the same position of the '+' button, the dialog doesn't shows up.
I will try to give you an test case, if i you couldn't find a solution. But if you have any clue, please feel free to tell me your idea.
Kevin,
I've found a way to get the click of the '+' button and to show the Jquery UI dialog.
it's not perfect but i'm trying to modify the solution. I will let you know if i've a probelm with that.
Thank you once again for your help
Hi,
I need help to keep only one child row opened at a time. That's mean that when we opened a child row detail and we decide to consult another, the child row, which was opened, is closed .
Or if it's possible to keep open all the child when we click on the '+' button. Because it's work for the previous rows of the row where the child row detail is open but for the rows that are after it popups an error message
"DataTables warning: table id=detail - Cannot reinitialise DataTable. For more information about this error, please see http://datatables.net/tn/3"
Thanks in advance
We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.
Cheers,
Colin
It's ok i find a solution.
Thanks to you and Kevin
Have a great day,
John
Do you know how to have thousands sperated with space, please ?
I've tried
And also this in the render of the columnDefs :
return d.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
And it doesn't works.
And also i want to make a difference between the child rows so i wanted to add background color like in this test case. But it doesn't fit for my uses.
Can you help me with that please?
Thanks in advance.
John
I believe
language.thousands
is for the information elements that Datatables displays and not for the table data. You can use a number renderer to format the row data numbers.The link doesn't seem to work. Styling issues are specific to each page. To help we will need a link to your page or a test case showing the issue.
Kevin