You were correct, Jose... there must've been something going on the last time I tried it. So now, here's my code..

$(document).delegate("[id^='bws-cv-grid-']", "iggridtooltipstooltipshowing", function (evt, args) {
        args.tooltip = args.element.textContent;
});

The only problem now is that the tooltipsshowing event doesn't fire for the bottom row if I have 1 extra header row and it doesn't fire for the bottom 2 rows if I have 2 extra header rows and so forth. Any idea how I could force this event to fire on the last number of rows when I add the same amount of extra header rows?

Thanks so much.

-Jared

Hi Jared Meier,

Thank you for the update.

Please let me know the approach you've taken to add the column headers to the child grid. If possible, please attach a sample which I can review and possibly provide you with an approach which you can use to achieve the desired behavior.

I am looking forward to your update.

The approach used was to clone the header row...

    $("td[class*='ui-iggrid-childarea']:not([class*='additional-header-below-this'])").each(function (index, element) {
        var table = $(element).closest("table");
        var headerColumns = $("#" + table.attr("id") + " > thead > tr > th.ui-iggrid-header");
        var headerRow = $(headerColumns).closest("tr");

        headerRow.each(function () {
            var $clone = headerRow.clone();
            $clone.wrap("<div>");

            var outerHtml = $clone.parent().html();

            var childGridRow = $(element).parent();
            var childGridRowId = childGridRow.attr("data-id");

            $(element).addClass("additional-header-below-this");
            $(childGridRow).addClass("additional-header-below-this");

            var nextRow = $(childGridRow).next();

            $(outerHtml).insertBefore(nextRow);
            $(nextRow).prev().hide();
            $(nextRow).prev().show(1500);
        })
    });

("#divSearchResults").on("click", ".ui-iggrid-expandcolumn", function (e) {
    ToggleExtraHeaders($(this));
});

function ToggleExtraHeaders(toggleElement) {
    var tr = $(toggleElement).closest("tr");
    var nextRow = $(tr).next(".additional-header-below-this").next();
    var minus = $(toggleElement).children().children(".ui-icon-minus");
    var plus = $(toggleElement).children().children(".ui-icon-plus");

    minus.each(function (index, element) {
        nextRow.hide(0);
    });

    plus.each(function (index, element) {
        nextRow.show(2000);
    });
}