title: d3.js - Row click event?
body: <p>I have created a table and updated the data from csv using the function. The file to be read is passed as param.</p>
  
  <pre><code>function displayContent(file){
  
   d3.text(file, function(datasetText) {
     parsedCSV = d3.csv.parseRows(datasetText);
     var sampleHTML = d3.select("#TableContents")
       .append("table")
       .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")
       .text(function(d){return d;})
       .style("font-size", "12px");
    });
  }
  </code></pre>
  
  <p>I would like to have a functionality where if i click  the first column, i can show another table with details of the row selected.</p>
  
  <p>For e.g, I have populated the student details in the table. Once i click any row(student id), i need to show another table based on the student selected. How do we add on click in the table row?</p>