I am using (4.0) to display records from a database query: The user fills out a query from. On submit, the form slides out to the left and the element with the slides in from the right. My dataProvider grabs up to 30 records at a time. As the user scrolls up, more records arrive and the dataProvider updates the grid size.
I want to reuse the for the next set of results. My the problem is that if the next set of records is less than the last grid size, I see my new records and the old records as well. How can I clear the grid of the old records before running my new query?
I read that calling this.$.grid.clearCache() will clear the cache, but it also reloads data from the dataProvider, which means it tires to run the old, now closed query.
My solution so far has been to create on each query an element that includes the and add that to the DOM, and to remove it when I return to the query form. This feels clumsy. Is there a way to reuse my grid?