d3.js filters.

[hai2...@gmail.com]

Hi,

I have a table which contain the Application details. I have bound the data to the table. Now when i click on first column, i want to select a set of data from another csv which matches the row data. I am using filter for this. but it is not working.

Code :

d3.text(file, function(datasetText) {

parsedCSV = d3.csv.parseRows(datasetText);

var sampleHTML = d3.select("#TableContents")

    .append("table")

    .style("border-collapse", "collapse")

    .style("border", "2px black solid")

    .attr("style", "margin-left: 20px")

    .selectAll("tr")

    .data(parsedCSV)

    .enter().append("tr")

    .selectAll("td")

    .data(function(d){return d;})

    .enter().append("td")

    .style("border", "1px black solid")

    .style("padding", "5px")

    .text(function(d){return d;})

    .style("font-size", "12px")

    .on("click", function(){AppTableClick(this)});

});

     

function AppTableClick(a)

{

    if (a.cellIndex ==0) // get the data from the first column

{

        if(a.innerHTML!='Application')

 {

           

d3.text(fileRef, function(datasetText)  //file ref is the file that contains details of the application selected

            {

            

parsedCSVref = d3.csv.parseRows(datasetText);

           

var sampleHTMLref = d3.select("#AppCompcontents")

    .append("table")

             

            .filter(function(d){ return d.Application == a.innerHTML}) //trying to filter based on the data selected by clicking

    .style("border-collapse", "collapse")

    .style("border", "2px black solid")

    .attr("style", "margin-left: 20px")

    .selectAll("tr")

    .data(parsedCSVref)

             

    .enter().append("tr")

    .selectAll("td")

    .data(function(d){alert(d);return d;})

    .enter().append("td")

             

    .style("border", "1px black solid")

    .style("padding", "5px")

    .text(function(d){return d;})

    .style("font-size", "12px");

});

        }

    }

}