2

While I've seen various versions of this kind of error before, I have yet to see one with Durandal involved, which is where I think some of the issues are coming from.

I have a KendoUI grid where I display a number of Expenses, and I use a Durandal message box to add a new expense and the idea is that on submission of the new expense, the grid should refresh.

Now, several people have mentioned the following "solution":

var grid = $("#grid").data("kendoGrid");
grid.dataSource.read();

Unfortunately, this doesn't seem to work. While I am using a popup, because I'm using Durandal my code to refresh the grid is still within the page that the grid is on due to Durandal's promise methodology.

app.showDialog('viewmodels/empresas/egreso/addEgreso').then(function () {
    //the method called that uses the code above to attempt to refresh the grid
    refreshGrid();
});

Everytime it reaches the refreshGrid method, an error comes back saying that "grid" is not defined. How can I reach the grid property to refresh it after adding a new item to the database?

Any help would be greatly appreciated.

Kenny Steen
  • 67
  • 7
  • Is it a typo error? You said var grid = $("**grid**").data("kendoGrid"); but it looks to me that it should be var grid = $("**#grid**").data("kendoGrid");. – OnaBai Dec 04 '13 at 21:38
  • that was actually just a typo in the question, my source has $("#grid") as it should. I've modified the question to reflect that – Kenny Steen Dec 04 '13 at 21:42
  • 1
    Did you confirm that jQuery is actually finding the element #grid? (e.g. `console.log($("#grid").length);`). – Lars Höppner Dec 04 '13 at 22:43
  • How are you inserting data into the DataSource that the grid is connected to? – CodingWithSpike Dec 05 '13 at 00:17
  • Have you tried separating the data source declaration from the grid. I am not up to speed on durandel , but I guess there is a way to assign the dataSource to some in scope property. You could then call read, or fetch on the data source direct. – Steven Dec 10 '13 at 08:34

1 Answers1

3

I recommend assigning the grid to an observable in the grid property object:

view:

div data-bind="kendoGrid: myGrid"> /div

viewmodel:

var myGridObservable = ko.observable();

var myGrid = { widget: myGridObservable, data: null, dataSource: {...

then pass the myGridObservable to your view and you can do:

myGrid().dataSource.read();

Miguel Velasco
  • 46
  • 1