MVVM Grid headerTemplate on nested columns breaks the grid when setting columns through setOptions

[Odd Veibust]

Hi,

We're using a custom binding to set columns from the view model, but we're experiencing some trouble using nested columns and headerTemplate.

I set up a dojo example where you can see the problem. It will occur if you uncomment the headerAttributes that's commented out.

Anyone have any idea how to get this to work properly?

Dojo example: https://dojo.telerik.com/ApIGimiv/2

[Georgi Denchev]

Hi, Odd,

Thank you for the provided Dojo.

You can transform the 'Columns' binding into a function that returns the array of items. This way the columns array won't be affected by the default binding mechanisms(which are to turn every object into an ObservableObject).

    Columns: function() {
      return [
        {
          title: 'Account',
          headerAttributes: { class: 'sales-header' },
          columns: [
            { field: 'AccountNumber', title: 'Account number', headerTemplate: 'No', width: 70 },
            { field: 'AccountItems', title: 'Account items', headerTemplate: 'Pcs', width: 70 },
          ]
        },
      ]
    }

Dojo

https://dojo.telerik.com/@gdenchev/AJafuder 

Best Regards,
Georgi Denchev
Progress Telerik