Sliding Child Rows with View Component

jwalker

Hi
Firstly, great work on the DataTables extensions. As a newbie to web development they rapidly produce good looking and feature rich pages.

I'm after some pointers or examples on adding Child rows if anyone can assist please? I'm happy with the examples in the documentation, but struggling to get it working whereby the Child row that is added is an MVC View component. I'm using ASP.NET CORE 2 MVC.

The problem being that I don't want the view component to render to the html page, before the user expands the 'parent row'.

Thank you very much for anyone who can help.

Thanks

Jim

datahandler

Hi jwalker,

The way I achieve this is using a feature available here

Then by doing something similar to the following example:

$('#myTable').DataTable({
    slidingChild: {
        source: function(parent, response) {
            $.get('/Child/GetByParentId/' + parent.data('id'), response);
        }
    }
});

In the example above, each time a 'parent' row is clicked, the source function is called to obtain the response to show in the child. The 'parent' parameter is a jQuery instance of the clicked row. You could replace $.get('/Child/GetByParentId/' + parent.data('id'), response); with your endpoint to retrieve the component to render.

I hope that helps.
Nick