D3js filter table

Question

I'm workin in a table filter with D3js, and I'm close to get it right. the filter is partially working, it sometimes return the right data and sometimes it doesn't

here I get all the data:

here the filter is working:

but here it doesn't work:

if I delete all the filters it brings me all the data, which is ok.

This is how I'm doing the filter at this moment. I have an example here

function updates(selectedGroup){

    if (selectedGroup.length>0){

      dataFilter = data.filter(function(d,i){if (selectedGroup.includes(d.Departamento? d.Departamento : 0)){return d};});

    }else {
      dataFilter=data

    }

    var rows = tbody.selectAll("tr")
        .data(dataFilter);

    rows.exit().remove();

    var rowsEnter = rows.enter().append('tr')
     .selectAll("td")
     .data(function(row) {
            return columns.map(function(column) {console.log('entro');
                return {column: column, value: row[column]?row[column]:0};
            });
        })
        .enter()
        .append("td")
        .attr("style", "font-family: Courier") // sets the font style
            .html(function(d) {return d.value? d.value : 0; });

} 

Answer 1

Right now you have just an "enter" selection, but nothing changing your "update" selection, which would be like this:

rows.selectAll("td")
  .data(function(row) {
    return columns.map(function(column) {
      return {
        column: column,
        value: row[column] ? row[column] : 0
      };
    });
  })
  .html(function(d) {
    return d.value ? d.value : 0;
  });

Here is your forked code: https://plnkr.co/edit/OJvAOwiP18VXKZkT?open=lib%2Fscript.js&preview