Flexgrid - Vue 2- How to dynamically add columns?

Flexgrid - Vue 2- How to dynamically add columns?

Posted by: daryn.holmes on 30 October 2017, 10:52 am EST

• 

  daryn.holmes

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 30 October 2017, 10:52 am EST

  Hi,

  How can I dynamically create columns in the FlexGrid control.

  I tried to use this in the templates:

  <wj-flex-grid-column v-for="(col, index) in gridData.columns" :key="index"  binding="col" header="col"></wj-flex-grid-column>
  

  However that did not seem to work.

  The columns only show if I have auto-generate-columns set to true.

  Do you have any advice?

  Thanks, Daryn

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 31 October 2017, 7:28 am EST

  Hi Daryn,
  
  You need to use “:” before binding so that it can evaluate the col value. Please refer to the following code snippet for the same.

  <wj-flex-grid :items-source="data">
         <wj-flex-grid-column  v-for="col in colDef" :key="col" :binding="col"></wj-flex-grid-column>
      </wj-flex-grid>
  

  ~Manish