« back to examples

To expand and collapse rows and columns, click on ▶ and ◢ arrows in the table. Click on a value cell to view the list of contributors. Scroll down to view the code.


    // This example demonstrates table event handlers to perform onclick drill-down 

    $(function() {
        var dataClass = $.pivotUtilities.SubtotalPivotData;
        var renderers = $.pivotUtilities.subtotal_renderers;

        $.getJSON("data/mps.json", function(mps) {
            $("#output").pivotUI(mps, {
                dataClass: dataClass,
                rows: ["Province", "Age"],
                cols: ["Party"],
                aggregatorName: "Integer Sum",
                vals: ["Age"],
                renderers: renderers,
                rendererName: "Table With Subtotal Heatmap",
                rendererOptions: {
                    table: {
                        eventHandlers: {
                            "click": function(e, value, filters, pivotData){
                                var names = [];
                                pivotData.forEachMatchingRecord(filters,
                                    function(record){ names.push(record.Name); });
                                alert(names.join("\n"));
                            }
                       }
                    }
                }
            });
        });
    });
    

« back to examples