jquery-bootgrid icon indicating copy to clipboard operation
jquery-bootgrid copied to clipboard

How to add custom content in a new row, below the managed row

Open skotl opened this issue 8 years ago • 2 comments

Thanks for your efforts, by the way - a great tool!

I am using Ajax to populate the rows and I have a button marked "VV" which is intended to expand the row to show child records. I planned to do this by selecting the row and then running;

row.after("<tr><td colspan='4'/><table><tr><td>All the shiny new text</td></tr></table></td></tr>");

I would then use other jquery/javascript magic to populate the new table inside the appended row. Note that I don't expect this table to survive any re-querying / sorting, etc. I'm quite happy for the row/table to be thrown away and they need to press the "VV" button to expand the row again.

The problem that I face is that when I call .after, I guess bootgrid is stripping out all of the attributes, so what I get left with is;

<td>All the shiny new text</td>

I'm guessing that bootgrid is firing on the new row being added and applying the default table styles. Is there a way for it to ignore this and/or accept raw HTML being inserted into the table?

Thanks

skotl avatar Dec 02 '16 00:12 skotl

Apologies - I may have fixed it already! I'm adding a div with after;

row.after("<div><table>....");

And that seems to be working, albeit on Chrome and IE11

It's perhaps an interesting feature to document; how to introduce a custom child table or child elements per row?

skotl avatar Dec 02 '16 00:12 skotl

try out http://gijgo.com/grid/configuration/detailTemplate

stvowi avatar Sep 22 '17 22:09 stvowi