show row chart after clicking a other chart (dc.js)

Question

I have two row charts and need to show the 2nd chart after i clicked (selectetd one) on the first row chart. how can i make it?

I can't add a js fiddle, because i'm getting my data from a database.

 var TestCaseRow = dc.rowChart("#TestCaserowchart");
 var TestCaseDim = perfData.dimension(function (d) {
     return d.TestCase;
 });
 var clickGroup = TestCaseDim.group().reduceCount(function (d) {
     return d.x;
 });        
 var filtered_groupTestCase = remove_empty_bins(clickGroup);

 TestCaseRow
    .width(1100)
    .height(filtered_groupTestCase.all().length*18)
    .margins({ top: 5, left: 10, right: 10, bottom: 20 })
    .dimension(TestCaseDim)
    .group(filtered_groupTestCase)
    .elasticX(true);

//my other row chart 
var testscriptRow = dc.rowChart("#testscriptrowchart");
var testscriptDim = perfData.dimension(function (d) {
    return d.TestScript;
});

var ClickTestscriptGroup = testscriptDim.group().reduceCount(function (d) {
    return d.x;
});
var filtered_groupTestScript = remove_empty_bins(ClickTestscriptGroup);
testscriptRow
    .width(1100)
    .height(filtered_groupTestScript.all().length*40)
    .margins({ top: 5, left: 10, right: 10, bottom: 20 })
    .dimension(testscriptDim)
    .group(filtered_groupTestScript)
    .elasticX(true);

Answer 1

Register an event-handler on the first chart with .on('filtered', function(chart, filter){...}) . Within that function, check if the 2nd chart is displayed and if it is not, do whatever you need to do to display it.