CODEWITHSUNDEEP
javascriptd3.js
Robert Andersson
Robert Andersson

Reputation: 1521

Table based on csv data not updating properly d3js v4

In This table I'm filtering through data in the filter function that updates the table with a new array that the filter function provides.

There doesn't appear to be anything wrong with the filtered array being passed through to the update function so I'm guessing I'm doing something wrong in the update section and I can't figure out what's wrong with it

I've looked through other answers and tried doing it that way but they are all based on d3js v3 so the logic isn't compatible with v4 as far is I can see.

Upvotes: 1

Views: 137

Answers (1)

Mikhail Shabrikov
Mikhail Shabrikov

Reputation: 8509

You need just two small changes in your code:

1) Move rows.exit().remove() before enter method:

var rows = tbody.selectAll('tr')
  .data(dataNew, d => d.name);

rows.exit().remove(); // <== !!!

rows = rows
  .enter()
  .append('tr')
  .merge(rows);

2) Append text for tdRow after merge:

tdRow = tdRow
  .enter()
  .append('td')
  .merge(tdRow)
  .text(d => d.value) // <== !!!

Check updated plnkr

Upvotes: 2

Related Questions