Buttons on table row not working on narrower screen
Buttons on table row not working on narrower screen
Murray
Posts: 20Questions: 7Answers: 0
I have a number of buttons on each row of a table. When seen on a big enough screen the buttons are on the same row as the data including the id. If I resize the screen the buttons appear when the green/white + is clicked. they are now on a different row in the table and do not work as they no longer pick up the id of the row, or should I say what is now the previous row. The code used for this at present is:
columns: [
{ title: "Id" },
{ title: "Reference" },
{ title: "First Name" },
{ title: "Last Name" },
{ title: "Phone" },
{ title: "Email" },
{ title: "Tests" },
{ title: "", "defaultContent": "<button class=\"view\">View Tests</button><button class=\"test\">Run Test</button><button class=\"edit\">Edit</button><button class=\"delete\">Delete</button><button class=\"addtest\">Add Test</button>" },
],
and
jQuery('#testclients tbody').on( 'click', 'button', function () {
var action = this.className;
var data = table.row( jQuery(this).parents('tr') ).data();
var memberid = data[0];
var access = '<?php echo $access; ?>';
if (action=='view') {
window.open('../clt/viewtests.php?id='+memberid,'_blank');
}
if (action=='test') {
window.open('../clt/clt_instruct.php?id='+memberid,'_blank');
}
if(action == 'edit') {
window.open('../clt/editclt.php?id='+memberid,'_blank');
}
How do I reference the id of the row above where the buttons now reside?
Thank you for any insights.
This question has an accepted answers - jump to answer
Answers
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
Thank you Colin
I have put code into http://live.datatables.net/lewitemu/1/
As you can see, when a button is clicked the relevant response occurs with the testid.
I have not been able to replicate when shrinking the screen the buttons appear under the original row and accessible by clicking the green/white +.
Under these circumstances on my system the test id is not retrieved as data[0] must be referring only to the upper row.
How do I get the testid to be available when the buttons are under the row of data?
Cheers
Murray
The problem was that there's an additional row when child rows are displayed, and that needs to be factored in - see updated example here: http://live.datatables.net/lewitemu/2/edit
It might also be worth looking at Editor, as that would make the CRUD operations easier!
Colin
Many thanks Colin for both the answer and the quick response.
Murray