angulardataadapterjqxgrid

Refresh jqxgrid with angular2


First I want to mention that I'm using angular2 with jqxgrid.

I got jqxgrid which displays dynamic data and working fine. But when I try to refresh grid or try to rebind it, grid displays first time loaded data, not refreshed one.

My code to display data in jqxgrid is given below:

        let url = "http://xxxx" + parameter1 + "xxxx" + parameter2;

        let sourceGrid =
        {
            datatype: "json",
            datafields: [{ "name": "name", "type": "string" },...],
            url: url
        };

        let dataAdapter = new $.jqx.dataAdapter(sourceGrid, {
            downloadComplete: (data, status, xhr) => { },
            loadComplete: data => { },
            loadError: (xhr, status, error) => { }
        });

        this.settings = {
            width: 1500,
            source: dataAdapter,
            ....,
            columns:[{ "text": "name", "datafield": "name"},...]
       }

       this.myGrid.createWidget(this.settings);

everything is working fine upto this point. On click event of button, I got data by passing parameter i.e. new data is coming in dataAdapter, but jqxgrid is not rebinding or refreshing new data. So far I've tried:

       ...
       dataAdapter.dataBind();
       this.myGrid.source = sourceGrid;
       this.myGrid.updatebounddata();
       ...

I got new data with dataAdapter binding but jqxGrid is still displaying old data. I've tried refreshData(), refresh(), tried with new adapter, but grid is refreshing. Not sure with sequence.

Can anybody help me out with quick solution?


Solution

  • I got a solution to refresh grid with dynamic data:

    this.mygrid.setOptions({source:{}}); or new DataAdapter
    

    Thanks jQWidgets team