Ticket T666596

Visible to All Users

How to refresh DataGrid to see changed rows

Ariel Gonzalez 1

created 7 years ago

We are using the data grid with [remoteOperations]="true" in an angular app.

The data store was created using AspNetData.createStore method.

Once the user select any record on the grid, we show a detail page, where they can edit the record. Once the user saves the changes, we want to replace the corresponding record in the grid with the modified one. Before using remote operation, we could easily replace it on the bound data store. But now that we are using remote loading, we don't know how can we find/access the record in the store that was created using AspNetData.createStore method.

Answers approved by DevExpress Support

DevExpress Support Team

created 7 years ago

Hi Ariel,

The createStore method returns the CustomStore instance. You can call the CustomStore.update method to save changes and then, call the reload method of your data source. For instance:

JavaScript
gridComponent.instance.getDataSource().store().update(keyValue, {/*options*/}).then(() => {  
    gridComponent.instance.getDataSource().reload();  
})

See also:
dxDataGrid.getDataSource

Show previous comments (9)

Ariel Gonzalez 1 7 years ago

do I have to go through grid component? Can I do something like this instead:

recordsDataStore = AspNetData.createStore({ …

and later

recordsDataStore.update(keyValue, {})
recordsDataStore.reload()

Alessandro (DevExpress Support) 7 years ago

Hi,

Yes, if you can access the instance of the CustomStore directly, use it in your code.

Ariel Gonzalez 1 7 years ago

but when I call update method, I get this error:

core.js:1624 ERROR Error: E4011 - Custom Store method is not implemented or is not a function: update. See:
http://js.devexpress.com/error/17_2/E4011
at makeError (error.js:51)
at Object.Error (error.js:19)
at ensureRequiredFuncOption (custom_store.js:38)
at inheritor._updateImpl (custom_store.js:263)
at inheritor._updateImpl (class.js:16)
at inheritor.update (abstract_store.js:100)
at SafeSubscriber._next (crud-workspace.component.ts:149)

DevExpress Support Team 7 years ago

Ariel,

Make sure that the updateUrl option is specified in your store configuration.

Ariel Gonzalez 1 7 years ago

but we are not updating through the grid. Update happens on a detail page on the side. The click save button, we call the service to persist. Now we just need to tell the grid the the row has been updated and pass the updated value to display.

DevExpress Support Team 7 years ago

In this case, do not call the update method.

Ariel Gonzalez 1 7 years ago

so how do we refresh then. Calling just reload also fails with this error:

TypeError: _this.recordsDataSource.reload is not a function

DevExpress Support Team 7 years ago

Ariel,

The reload method belongs to the DataSource instance. You will need to get this instance using the DataGrid instance as I mentioned in my answer.

Ariel Gonzalez 1 7 years ago

this works. The only problem is it makes a web api request to get the data, when I already have the data on the client. So, there is no way to push changes on the grid manually?

DevExpress Support Team 7 years ago

Take a look at the dxDataGrid - How to update a certain row using SignalR ticket where we discussed how to update rows without reloading.

Chandrabhan 4 years ago

How should we do in win application

Alisher (DevExpress Support) 4 years ago

Hello,

I created a separate ticket on your behalf: (T991673: How to refresh DataGrid to see changed rows). We placed it in our processing queue and will process it shortly.

Created: August 22, 2018 8:42 PM

Modified: April 20, 2021 8:25 AM

Platform: Angular

Product: DevExtreme Data Grid

Build: 18.1.3

Disclaimer: The information provided on DevExpress.com and affiliated web properties (including the DevExpress Support Center) is provided "as is" without warranty of any kind. Developer Express Inc disclaims all warranties, either express or implied, including the warranties of merchantability and fitness for a particular purpose. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.

Confidential Information: Developer Express Inc does not wish to receive, will not act to procure, nor will it solicit, confidential or proprietary materials and information from you through the DevExpress Support Center or its web properties. Any and all materials or information divulged during chats, email communications, online discussions, Support Center tickets, or made available to Developer Express Inc in any manner will be deemed NOT to be confidential by Developer Express Inc. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.

How to refresh DataGrid to see changed rows

Answers approved by DevExpress Support

Recently viewed tickets