DataTable RowDetails Sample , need to expand deatils On clicking on the row
DataTable RowDetails Sample , need to expand deatils On clicking on the row
SapnaSNA
Posts: 3Questions: 1Answers: 0
hello ,
This sample shows clicking on the green (+) sign on the row the child detail expand.
I have a requirement as the same expansion should happen clicking on anywhere on the row( execpt the checkbox we have for selection)
I am a beginner and used a simple datatable example. Can someone give me an example for this?
can I write the code here?
$('#example tbody').on('click', 'tr', function () {
Or please suggest the right method?
Thanks,
SNA
This question has an accepted answers - jump to answer
This discussion has been closed.
Answers
Hello @SapnaSNA ,
I have tested it and what you've included in your question works for me.
can you include your whole .js file (or Table and
.on('click')function), so I can check you're not missing something from somewhere else.For inline code highlighting use
\code here...`` and for larger scripts do this:(without the backslash)
Which will look like:
Regards,
David
this code worked for me , more detail on this below.....
$('#example tbody').on('click', 'tr,.details-control,.expcol-mob, .ist-mob-col', function () {
//alert('clicked');
//function here
if (row.child.isShown() && row.cli) {
// This row is already open - close it
row.child.hide();
tr.removeClass('shown');
}
else {
// code here
}
Now the new requirement is , expand should happen when i click anywhere on the row,
But collapse will happen only by clicking on the plus sign(+).
Clicking rowheader should not collapse.
You'll have to use the JQuery
.off()method to remove the event handler that you associate with that row and leave only the handler on tr.detail-control. Just don't forget to put it back on when you collapse the row again.Regards,
David
Thanks for replying. It helped.
I have another requirement here , there is a checkbox and a button on the row(1st and last columns ). When clicking on either of this, the row would not expand.
On the Row Click method-----
I have used this code to identify the checkbox and button..
event.target.control.id.indexOf('chkSelect')--
event.target.id.indexOf('btnDownlload')--
---return if the above code comes true.
Is this the right way ?Or any other method you could suggest?
Thanks,
SNA
Hi @SapnaSNA ,
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