jQuery JTable Problems to find selected rows in ChildTable

Question

I have some problems finding my selected rows in a nested JQuery JTable via a Toolbar Click.

This is my nested table which works fine:

$(document).ready(function () {
    $('#TableContainer').jtable({
        title: 'MyList',
        sorting: true,
        defaultSorting: 'list_id desc',
        actions: {
            listAction: 'lists_list_action.php?action=list',
            updateAction: 'lists_list_action.php?action=update',
        },

        fields: {
            list_id: { title: 'Nr.', key: true, list: true, width: '10px', listClass: 'psg_list_center' },

            //CHILD TABLE "Abos"
            abos: {
                title: 'Abos',
                width: '5%',
                sorting: false,
                edit: false,
                create: false,
                display: function (ListData) {
                    //Create an image that will be used to open child table
                    var $img = $('<img src="../../images/list_metro.png" title="manage Listabos" />');
                    //Open child table when user clicks the image
                    $img.click(function () {
                            $('#TableContainer').jtable('openChildTable',
                            $img.closest('tr'), //Parent row
                            {
                                title: 'List: ' + ListData.record.list_name,
                                selecting: true,            //Enable selecting
                                multiselect: true,          //Allow multiple selecting
                                selectingCheckboxes: true,  //Show checkboxes on first column
                                selectOnRowClick: false,    //Enable this to only select using checkboxes
                                actions: {
                                    listAction: 'lists_list_action.php?action=AbosList&ListId=' + ListData.record.list_id,
                                    deleteAction: 'lists_list_action.php?action=AbosDelete&ListId=' + ListData.record.list_id,
                                },
                                fields: {
                                    list_id: { type: 'hidden', defaultValue: ListData.record.list_id },
                                    person_id: { key: true, create: false, edit: false, list: false },
                                    person_name: { title: 'Name', width: '40%' },
                                    created_name: { title: 'created from', create: false, edit: false },
                                    created_on:   { title: 'created on',   create: false, edit: false },
                                    updated_name: { title: 'updated from', create: false, edit: false },
                                    updated_on:   { title: 'updated on',   create: false, edit: false },
                                },
                                toolbar: {
                                    items: [{
                                        //icon: '/images/trash.png',
                                        text: 'remove selected Abos',
                                        click: function () {

                                            // here i need to something like this:
                                            alert('list_id=' + record.list_id + ', person_id=' + record.person_id);
                                            delete_abo(record.list_id, record.person_id);

                                        }
                                    }]
                                },
                            }, function (data) { //opened handler
                                data.childTable.jtable('load');
                            });
                    });
                    //Return image to show on the person row
                    return $img;
                }
            },

            list_name: { title: 'List Name' },
            list_description: { title: 'Description', type: 'textarea' },
            list_active: { title: 'activ', options: { 1: 'Yes', 0: 'No' } },
            list_allow_subscribe: { title: 'Subscribe erlaubt', options: { 1: 'Yes', 0: 'No' } },
            list_allow_unsubscribe: { title: 'Unsubscribe erlaubt', options: { 1: 'Yes', 0: 'No' } },
        },
    });
    $('#TableContainer').jtable('load');

});

Can anybody help me at the toolbar-click Section, finding the selected Rows of the Child-Table?

I tried to do something like this:

click: function (ListData) {
    var $selectedRows = ListData.jtable('selectedRows');

or:

click: function () {
    var $selectedRows = $('#TableContainer').jtable-child-table-container.jtable('selectedRows');
    $('#TableContainer').jtable('delete', $selectedRows); 
}

or:

click: function () {

    var $selectedRows = $('#TableContainer').jtable-child-table-container.jtable('selectedRows');

    if ($selectedRows.length > 0) {
        $selectedRows.each(function () {
            var record = $(this).data('record');
            alert('list_id=' + record.list_id + ', person_id=' + record.person_id);
            //delete_abo(record.list_id, record.person_id);
        });
    } else {
        //No rows selected
        alert('please select some rows first!');
    }
}

because the last part worked fine in an "not nested" part of my program, but I did not come to an resolution anyhow...

Thanks for help!

Answer 1

finaly found the solution!

The Key to get the selected Rows:

var $selectedRows = $('#TableContainer>.jtable-main-container>.jtable>tbody>.jtable-child-row .jtable-row-selected');

or the whole working function:

click: function () {

 var $selectedRows = $('#TableContainer>.jtable-main-container>.jtable>tbody>.jtable-child-row .jtable-row-selected');

 if ($selectedRows.length > 0) {
     $selectedRows.each(function () {
         var record = $(this).data('record');
         alert('list_id=' + record.list_id + ', person_id=' + record.person_id);
         //delete_abo(record.list_id, record.person_id);
     });
 } else {
     //No rows selected
     alert('please select some rows first!');
 } }