How to refresh grid on row update? about jsgrid HOT 17 CLOSED

So several items are changed on changing of a single row? Interesting...
What if you just reload data then:

$("#jsGrid").jsGrid("loadData");

from jsgrid.

Thank you for the feedback!

Actually, grid shows entered data on update only if updateItem doesn't return item from the server.
Thus, if your server script will return actually saved item, the grid renders it.

This how it looks in source code:

this._controllerCall("updateItem", updatingItem, function(updatedItem) {
   updatedItem = updatedItem || updatingItem; // here we take item resolving promise of updateItem
   this._finishUpdate($updatingRow, updatedItem, updatingItemIndex);
   ...

from jsgrid.

Ok, so this just needs to return the data similar to how the loadData would return for pageLoading?

On Jun 14, 2015, at 11:24 AM, Artem Tabalin [email protected] wrote:

Thank you for the feedback!

Actually, grid shows entered data on update only if updateItem doesn't return item from the server.
Thus, if your server script will return actually saved item, the grid renders it.

This how it looks in source code:

this._controllerCall("updateItem", updatingItem, function(updatedItem) {
updatedItem = updatedItem || updatingItem; // here we take item resolving promise of updateItem
this._finishUpdate($updatingRow, updatedItem, updatingItemIndex);
...
—
Reply to this email directly or view it on GitHub #47 (comment).

from jsgrid.

Yep, but return only updated item (not all items).

updateItem: function(item) {
    var d = $.Deferred();

    $.ajax({
        type: "PUT",
        url: "/items",
        data: item
    }).done(function(updatedItemReturnedFromServer) {
        d.resolve(updatedItemReturnedFromServer); // here we resolve promise with actual item
    });

    return d.promise();
}

Of course, if your script returns updated item you don't have to use this verbose code and just return ajax promise:

updateItem: function(item) {
    return $.ajax({
        type: "PUT",
        url: "/items",
        data: item
    });
}

from jsgrid.

I am not using server side. I am using local storage, when I return the promise, it just gives back a blank row on the screen even though the object has data. Here is what I am using, perhaps I am doing something wrong here?

updateItem: function(updatingClient) {
var db = window.openDatabase("Database", "1.0", "MyDb", 200000);
db.transaction(function(tx) {
var db = window.openDatabase("Database", "1.0", "MyDb", 200000);

                            tx.executeSql(//Update Statement is in here);
                      });

                        var feeds = "";
                        var def = $.Deferred();

                        db.transaction(function(tx) {
                                var db = window.openDatabase("Database", "1.0", "MyDb", 200000);
                                tx.executeSql("SELECT Id,Col1 FROM MyTable where id = "+updatingClient.Id, [], function(tx, results) {
                                          var feedarray = [];
                      var len = 1;
                                          var roaObj =results.rows.item(0);
                                          var jsonString=JSON.stringify(roaObj);
                                          var jsonObj=JSON.parse(jsonString);

                                          feedarray.push(jsonObj);
                                          feeds = {
                                                            data: feedarray,
                                                            itemsCount: len
                                          };
                                          def.resolve(feeds);
                                });
                        });
                    return def.promise();

On Jun 14, 2015, at 11:46 AM, Artem Tabalin [email protected] wrote:

Yep, but return only updated item (not all items).

updateItem: function(item) {
var d = $.Deferred();

$.ajax({
    type: "PUT",
    url: "/items",
    data: item
}).done(function(updatedItemReturnedFromServer) {
    d.resolve(updatedItemReturnedFromServer); // here we resolve promise with actual item
});

return d.promise();

}
Of course, if your script returns updated item you don't have to use verbose code and just return ajax promise:

updateItem: function(item) {
return $.ajax({
type: "PUT",
url: "/items",
data: item
});
}
—
Reply to this email directly or view it on GitHub #47 (comment).

from jsgrid.

Frankly, for the grid there is no difference what kind of storage you use. Just resolve promise with actual updated item, as I did in the sample with ajax request.

from jsgrid.

Ok thanks. I'll keep messing with it. It's returning for me, but just giving me a blank line.

On Jun 14, 2015, at 12:12 PM, Artem Tabalin [email protected] wrote:

Frankly, for the grid there is no difference what kind of storage you use. Just resolve promise with actual updated item, as I did in the sample with ajax request.

—
Reply to this email directly or view it on GitHub.

from jsgrid.

Could you show me your updateItem method?

from jsgrid.

updateItem: function(updatingClient) {
var db = window.openDatabase("Database", "1.0", "MyDb", 200000);
db.transaction(function(tx) {
var db = window.openDatabase("Database", "1.0", "MyDb", 200000);

                            tx.executeSql(//Update Statement is in here);
                      });

                        var feeds = "";
                        var def = $.Deferred();

                        db.transaction(function(tx) {
                                var db = window.openDatabase("Database", "1.0", "MyDb", 200000);
                                tx.executeSql("SELECT Id,Col1 FROM MyTable where id = "+updatingClient.Id, [], function(tx, results) {
                                          var feedarray = [];
                      var len = 1;
                                          var roaObj =results.rows.item(0);
                                          var jsonString=JSON.stringify(roaObj);
                                          var jsonObj=JSON.parse(jsonString);

                                          feedarray.push(jsonObj);
                                          feeds = {
                                                          data: feedarray,
                                                          itemsCount: len
                                          };
                                          def.resolve(feeds);
                                });
                        });
                    return def.promise();

On Jun 14, 2015, at 1:30 PM, Artem Tabalin [email protected] wrote:

Could you show me your updateItem method?

—
Reply to this email directly or view it on GitHub.

from jsgrid.

As I wrote "Just resolve promise with actual updated item" (not all data).
def.resolve(feeds); - here you should provide single updated item instead of all feeds.

from jsgrid.

What if all fields get updated? Or multiple fields? Do the fields need passed separately?

On Jun 14, 2015, at 2:19 PM, Artem Tabalin [email protected] wrote:

As I wrote "Just resolve promise with actual updated item" (not all data).
def.resolve(feeds); - here you should provide single updated item.

—
Reply to this email directly or view it on GitHub.

from jsgrid.

It is several columns on the row that are changing. That is why I was passing the entire changed row back in my update method.

On Jun 15, 2015, at 3:22 AM, Artem Tabalin [email protected] wrote:

So several items are changed on changing of a single row? Interesting...
What if you just reload data then:

$("#jsGrid").jsGrid("loadData");
—
Reply to this email directly or view it on GitHub.

from jsgrid.

I did use the line that you listed below and it does work. to refresh the screen. I think this will work fine for what I am doing. Once again, thanks for the great support.

On Jun 15, 2015, at 3:22 AM, Artem Tabalin [email protected] wrote:

So several items are changed on changing of a single row? Interesting...
What if you just reload data then:

$("#jsGrid").jsGrid("loadData");
—
Reply to this email directly or view it on GitHub #47 (comment).

from jsgrid.

You are welcome!

from jsgrid.

I tried both ways mentioned above, but still getting blank data on the grid, whereas the data is updated in database. I don't want to load the data every time an update takes place. Please help!

from jsgrid.

@sanghviyash, I think it's better to open another issue on StackOverflow or here on GitHub and provide more info about the issue you have, with the grid config.

from jsgrid.

I'm having the following issue the first time I do an update the grid keeps the previous data if a refresh the entire page it gets the updated value and after that it never happens again untill i restart the app server

from jsgrid.