This is a migrated thread and some comments may be shown as answers.

Grid's Header doesn't refresh

7 Answers 359 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Victoria
Top achievements
Rank 1
Victoria asked on 29 Jan 2013, 04:05 PM
Hi,

I have a Kendo Grid that autorefreshes data every 15 minutes. It also has a dynamic header with the columns as dates (past 2 days worth of data). At midnight I would expect the headers to change by 1 day (from 1/28 to 1/29 and from 1/27 to 1/28), but this is not happening, even though the data refreshes just fine and in the very first column accurately displays today's (1/29) data with the header still being for yesterday (1/28). If I manually refresh the page, everything is working perfectly, but if I'd like it to silently refresh on the background, the headers are not refreshing. Both header's data and grid's data are coming from the same data source which is refreshed every 15 minutes.

HTML:
    <span data-bind="text: getDisconnectsMed" class="neutralTextMedium" >  </span> 
    <table id="gridDisconnectsMed" style="font-size: 8pt">     
     <thead>         
        <th data-field="Description">Description</th> 
        <th data-field="CountDay0" data-bind="text: setDay0Label"></th>
        <th data-field="CountDay1" data-bind="text: setDay1Label"></th>                                 
     </thead>
    </table>

JavaScript:

var disconnectsDS = new kendo.data.DataSource({
    transport: {
        read: {
            type: 'GET',
            contentType: 'application/json; charset=utf-8',
            url: getDisconnectsUrl,
            dataType: 'json'
        }
    },
    change: function (data) {
        disconnectsMediumViewModel.set("returnData", data.items);
    },
    error: function (e) {
        disconnectsMediumViewModel.set("error", e.errorThrown);
    }
});

var disconnectsMediumViewModel = kendo.observable({
    returnData: null,
    error: "none",
    getDisconnectsMed: function () {
        var value = checkForError(this.returnData, this.error);
        if (value.length == 0) {
            $("#gridDisconnectsMed").kendoGrid({
                dataSource: disconnectsDS,
                sortable: false,
                scrollable: false
            });
            $("#gridDisconnectsMed").show();
        }
        else
            $("#gridDisconnectsMed").hide();
        return value;
    },
    setDay0Label: function () {
        if (this.returnData != null && this.returnData.length > 0) {
            return kendo.toString(this.returnData[0].CountDay0Label);
        }
    },
    setDay1Label: function () {
        if (this.returnData != null && this.returnData.length > 0) {
            return kendo.toString(this.returnData[0].CountDay1Label);
        }
    }
});

Do you know what the issue might be?

Thanks,
Victoria

7 Answers, 1 is accepted

Sort by
0
Dimo
Telerik team
answered on 30 Jan 2013, 01:04 PM
Hi Victoria,

The Grid header content does not update automatically. You can use the widget's dataBound event to check whether the date needs changing and update it manually via standard DOM operations.

All the best,
Dimo
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Kubica
Top achievements
Rank 1
answered on 25 Jun 2015, 07:41 PM
Does anyone know if there has been an update to this that makes this an easier problem to solve?
0
Dimo
Telerik team
answered on 26 Jun 2015, 12:48 PM
Hello Chris,

The header area is recreated only when using setOptions() to recreate the whole Grid. Otherwise it is maintained static, for performance reasons.

http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#methods-setOptions

http://demos.telerik.com/kendo-ui/grid/persist-state

Regards,
Dimo
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Kubica
Top achievements
Rank 1
answered on 26 Jun 2015, 12:51 PM

Thanks, Dimo.  

Having a complete rerender is exactly what I'm looking for.  This grid's columns and groupings are contextual to prompted filter criteria on the page that a user will be changing and resubmitting. 

0
Kubica
Top achievements
Rank 1
answered on 26 Jun 2015, 07:11 PM

Is there a way to force a full refresh of the grid and detailInit with detail rows?  The grid is rerendering fine now, but I've spent half a day trying to get the detail row to completely rerender when a form submission is made that changes the columns.  

 

If I can get the entire thing to refresh that would be optimal.

0
Dimo
Telerik team
answered on 30 Jun 2015, 02:49 PM
Hi Chris,

I am not sure I understand your scenario. Using setOptions() on the child Grid should do the job, no?

Regards,
Dimo
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Kubica
Top achievements
Rank 1
answered on 30 Jun 2015, 03:15 PM

It is working now with setOptions() on both the parent and child grid.

 

Thank you.

Tags
Grid
Asked by
Victoria
Top achievements
Rank 1
Answers by
Dimo
Telerik team
Kubica
Top achievements
Rank 1
Share this question
or