Tooltips in grid not showing after Grid.setOptions call

[Jiri]

Hello,

I have a grid and I display tooltips on some of its columns. It works OK. I also have a DropdownList. After DropdownList change I read data for the grid again. The grid then shows new data, but the tooltips are never visible.

This is the function for DropDownList change event:

function ViewChanged() {
  $('#AccountGrid').data('kendoGrid').setOptions(initialAccountGridOptions);
  $('#AccountGrid').data('kendoGrid').dataSource.filter({});
  $('#AccountGrid').data('kendoGrid').dataSource.read();
}

I figured out that the tooltips are displaying when I delete the first line with setOptions function. But I need the setOptions function.

Is there a way how to use this function and still see the tooltips?

Thanks for answers.

[Aleksandar]

Hello Jiri,

As discussed in this forum thread when the setOptions() method is used the old tooltip has to be destroyed and initialized again after changing the Grid options.

          $("#load").click(function (e) {
            e.preventDefault();
            $("#grid").data("kendoTooltip").destroy();
            
            var options = localStorage["kendo-grid-options"];
            if (options) {
              grid.setOptions(JSON.parse(options));
            }
            
            $("#grid").kendoTooltip({
              filter: "td", 
              position: "right",
              content: function(e){
                var dataItem = $("#grid").data("kendoGrid").dataItem(e.target.closest("tr"));
                var content = dataItem.ContactName;
                return content;
              }
            }).data("kendoTooltip");
          });

I modified the Persist State Grid Demo to demonstrate a possible approach to handle the scenario. You can review the example in this dojo and apply similar logic in ASP.NET environment.

Regards,
Aleksandar
Progress Telerik