Lost the text boxes values inside the filter menu

Question

I writting a html/javascript page with a kendo grid with filter menu. I have faced the following problem: when I add a new object to the data source (new row) and its kendogrid is reloaded (datasource.read) I lose the textboxes values inside the filter menu that I was inputting the values.

Here is the demo: http://jsfiddle.net/3qT3J/2/

$("#grid").kendoGrid({
    dataSource: datasource1,
    height: 300,
    filterable: true  // <== shows a button on each column that display a filter menu

});
// reload the grid every 2 seconds:
 setInterval(function() {
        datasource1.read();
 }, 2000); 

Is there any way to fill the textboxes again when the grid is reloaded? how can I get the values entered by the user? Is there some kendogrid property that avoid to lose the values when the grid is reloaded?

I thought to get the values with an event listener in the textboxes, but I don't know which column the text box belongs... I added the event listener with the following code: $(".k-textbox").on("click change", function1);

Any idea? Thanks

Answer 1

You could pause reloading while the filter menu is open so the user can finish typing:

setInterval(function () {
    var pauseRefresh = $(".k-filter-menu:visible").length;
    if (!pauseRefresh) {
        datasource1.read();
    }
}, 2000);

(demo)