How to remove backgridjs row to display new rows?

Question

This appends a new set of rows to the original grid:

var refreshgrid = function(){
    var grid = new Backgrid.Grid({
      columns: columns,
      collection: ter
    });

    // Render the grid and attach the root to your HTML document
   // $("#example-1-result").append(grid.remove());
    $("#example-1-result").prepend(grid.render().$el);
}

thus, everytime I call it, it appends to the grid rather than overwriting it, which is what I want. How to achieve it?

Answer 1

Use .html() instead of .append()/.prepend() as .html() removes/overwrites the old value with new one :

var refreshgrid = function(){
    var grid = new Backgrid.Grid({
      columns: columns,
      collection: ter
    });

    // Render the grid and attach the root to your HTML document
    $("#example-1-result").html(grid.render().$el);
}