jQWidgets Forums
jQuery UI Widgets › Forums › Angular › Angular Grid Component
This topic contains 3 replies, has 2 voices, and was last updated by Yavor Dashev 3 years, 8 months ago.
-
AuthorAngular Grid Component Posts
-
I followed the tutorial and I got the grid to display data via data binding. I changed the source to use data that I am getting via a RestAPI call and the data binding is not working. Here is what the code looks like:
export class GridJqComponent implements AfterViewInit, OnInit {
cStatus: CloudStatus[] = [];columns = [
{text: ‘AKS Cloud Region’, datafield: ‘region’},
{text: ‘Status’, datafield: ‘status’},
];source = new jqx.dataAdapter({
localData: this.cStatus
});constructor(private cloudRetrievalService: CloudRetrievalService) { }
ngOnInit() {
this.getCloudStatus();
}getCloudStatus(): void {
this.cloudRetrievalService.getAKSCloudStatus()
.subscribe(status => this.cStatus = status);
}
ngAfterViewInit(): void {}
}
This is what the data structure looks like. It is very simple:
export interface CloudStatus{
region: string,
status: string,}
I know the RestAPI call is responding with JSON output but don’t know if the deserialization is working correctly or I am not setting the data correctly? Any suggestions? Thanks.
Hi sshintaku,
From the code snippet that you have shared I wasn’t able to completely reproduce the issue as described by you, but it could be caused because you haven’t set the
datatype
property of thejqx.dataAdapter
which corresponds to the data type that the jqxGrid is receiving.However if you create a complete code example which reproduces this behavior then we could be able to give you a viable solution for your use case.
Please, do not hesitate to contact us if you have any additional questions.
Best Regards,
Yavor Dashev
jQWidgets team
https://www.jqwidgets.comWell, I think it is the asynch rest api data binding that is the problem. The code when setting the data object as an array of objects does work. Do you have any sample code examples of doing an asynch web api call, then doing data binding?
Hi sshintaku,
In this scenario there could be several problems/issues.
We have documentation how to bind the data for the jqxGrid to mySQL database for example:
https://www.jqwidgets.com/jquery-widgets-documentation/documentation/phpintegration/bind-jquery-grid-to-mysql-database-using-php-mysqli.htmAlso I strongly recommend you to take a look at the properties of the jqxDataAdapter and in the documentation for it we have section for asynchronous binding. Link for the documentation: https://www.jqwidgets.com/jquery-widgets-documentation/documentation/jqxdataadapter/jquery-data-adapter.htm
Let me know what you think!
Please, do not hesitate to contact us if you have any additional questions.
Best Regards,
Yavor Dashev
jQWidgets team
https://www.jqwidgets.com -
AuthorPosts
You must be logged in to reply to this topic.