Our pure JavaScript Scheduler component


Post by LMS2021 »

Hi Team,
I'm trying to reload resource dropdown data each time I perform an action. The getEmployee() is being called each time and it returns different values but the listItemTpl is holding on to the first loaded values and not updating the current values which I'm passing in the items property.

Please Find the attachment.

Attachments
Capture.PNG
Capture.PNG (59.1 KiB) Viewed 527 times

Post by alex.l »

Hi LMS2021,

https://bryntum.com/docs/gantt/#Core/widget/Combo#config-items is a config, not a property.
Configs are options you supply on a configuration object when creating an instance of this class.

After a combo is initialized, you should use its store to manipulate data:

combo.store.data = [
     // your data
]

All the best,
Alex


Post by LMS2021 »

Hi,
I don't see any example of how you are using those combo inside a resource column.

    columns={[
          {
            type: 'resourceInfo',
            sortable: false,
            text: 'Employee',
            data: 'name',
            showImage: false,
            width: 130,
            sum: 'count',
            showEventCount: false,
            fullRowRefresh: true,
            triggerEvent: 'cellclick',
            summaryRenderer: () => `
                  <div style='text-align: right; font-weight: bold; line-height: 1.3;font-family: aveneir;font-size:12px'>
                      <div>Sales/15min</div>
                      <div># Recommended</div>
                      <div># Scheduled</div>
                      <div>Over/Under</div>
                  </div>`,
            editor: {
              features : {
                cellEdit : {
                    triggerEvent : 'cellclick'
                }
            },
              type: 'combo',
              valueField: 'name',
              displayField: 'name',
              instantUpdate: true,
              editable: false,
              htmlEncode: false,
              items:  getEmployee(),
              listItemTpl: item => filterbyXOH(`<div class='disabled' style=' text-decoration: replacevalue; disabled;opacity: 	 
                                                                       0.6;pointer-events: none;cursor:none; font-family: aveneir; font-size: 	 
                                                                        12px'>${item.id}</div>`,item.id,item),
              expandOnCellClick: true,
              listeners: {
                change: (selected: any) => changeEmp(selected),
                cellClick: (selected: any) => changeEmp('qweq'),
              },
              allowBlank : false
            },


      }}]

So Not clear how do you use combo store.

Thanks,
Mukesh.


Post by Animal »

Very difficult to read the code because of indenting and the fact that you embed a features property block inside your editor specification which does nothing.

What you probably need is a beforeCellEditStart listener : https://www.bryntum.com/docs/scheduler/#Grid/feature/CellEdit#event-beforeCellEditStart

And load the field's store in the handler.


Post by LMS2021 »

Hi,
I don't see any example of how you are using those combo inside a resource column.

Can you share any example of do you use combo for a resource column, and how do you refresh the combo when you click on the combo.

I do use the beforecellEditStart as one of the listeners. And I'm not able to read the combo options even in that.

Can you check the first screenshot attached to the I'm using getEmployee() to get the data for the combo, The method is being called each time but the data in the combo doesn't change. Please let me know how to update the combo each time when I call my getEmployee().
Thanks,
Mukesh.


Post by sergey.maltsev »

Hi!

Actually all you need is accessing combo from https://www.bryntum.com/docs/scheduler/#Grid/feature/CellEdit#event-beforeCellEditStart and updating it's store with new data.

Sample code for using beforeCellEditStart event with getEmployee() method.

const getEmployee = () => {
    return [
        { id : 1, text : 'Mark' },
        { id : 2, text : 'Bill' },
        { id : 3, text : 'Tim' }
    ];
};

new Scheduler({
...

    columns : [
      ... 
      {
            text   : 'Employee',
            field  : 'employee',
            editor : {
                type  : 'combo',
                items : []
            }
        }
    ],

    listeners : {
        beforeCellEditStart({ editorContext }) {
            const combo = editorContext.editor;
            combo.store.data = getEmployee();
        }
    },

});

Post by LMS2021 »

Thanks a lot. Got it.


Post Reply