Refreshing resourceData on change

[doonamis]

Hello!

I'm creating a scheduler with two resource columns, one with the driver name and the other one with the vehicleId

For the vehicle I'm using a template to display the vehicle name and plate, I've created a combo, my question is, how can I update the info on the cell with the new selected vehicle?

Currently this is what I have:

columns: [
    {
      text: 'Name',
      field: 'name',
      flex: 1,
      editor: false
    },
    {
      text: 'Vehicle',
      field: 'vehicleId',
      width: 130,
      htmlEncode: false,
      renderer: ({ value, record }) => `
        <div class="grid-resource-vehicle">
          <div class="grid-resource-vehicle__text">
            ${record.vehicleName}
            <small>${record.vehicleType}</small>
          </div>
        </div>`,
      editor: {
        type: 'combo',
        items: [],
        editable: false,
        onChange: function (value) {
          const newId = value.value
          const items = value.source._store._data
          const newVehicle = items.find(function (item) {
            return item.data.id === newId
          })
          console.log('Resource change', value, newVehicle)
        },
        listItemTpl: item => `<div>${item.name} - ${item.vehicleType}</div>`
      }
    }
  ]

Thanks

[Maxim Gorkovsky]

Hello.
If I understand correctly, you want to change row cell values when you pick vehicle in the combo inside the same row? You can use set method to change multiple values at once

onChange: function (value) {
          const newId = value.value
          const items = value.source._store._data
          const newVehicle = items.find(function (item) {
            return item.data.id === newId
          })
          const row = .... // get corresponding row record
          row.set(newVehicle.data) 
        }
        

[doonamis]

Thanks! Well I want to change the "labels" for the row, this will still work right? I don't know how to access the row element from the onChange function, could you add some light to this?

[Maxim Gorkovsky]

You can try finishCellEdit event.

grid.on('finishcelledit', ({ editorContext }) => {
  if (editorContext.column.field == 'vehicle') {
    editorContext.record.set(....)
  }
})

Record in this case would be edited row record which you want to update

[doonamis]

Hello! As I'm using Scheduler with vue, it is possible to do this in the config object?

Currently I have this:

listeners: {
   finishCellEdit({ editorContext }) {
        console.log('finishCellEdit')
        if (editorContext.column.field == 'vehicleId') {
          editorContext.record.set('hola')
        }
   }
}

But it doesn't seem to work

[sergey.maltsev]

Hi!

Sure this should work from the config.
What exactly not working for you?
You don't see console output finishCellEdit or no changes were made to the record?

Please refer to this docs for set method.
Two parameters are required: field and value.
https://www.bryntum.com/docs/grid/#Common/data/Model#function-set

[doonamis]

Hello sergey,

I don't see the log on the console nor the record has changed, I've edited the set line following your comments now is like

finishCellEdit({ editorContext }) {
        console.log('finishCellEdit')
        if (editorContext.column.field == 'vehicleId') {
          editorContext.record.set('vehicleName', 'test')
        }
      }

I'ts weird because I have another listener than is working without problem

Thanks!

[doonamis]

Hi sorry finally found it, I was setting the listener on the wrong path so the Scheduler didn't found it and wasn't doing nothing, now works!

Another thing is once i double click to start editing I see a white cell, even after selecting a new one, before "finishCellEdit" fires it keeps white, it's maybe because the cell is associated with "vehicleId" and I'm rendering "vehicleName" or i'ts the expected behavior?

Here's an example -> https://share.getcloudapp.com/xQuvqK9D

Thanks!

[pmiklashevich]

Another thing is once i double click to start editing I see a white cell, even after selecting a new one, before "finishCellEdit" fires it keeps white, it's maybe because the cell is associated with "vehicleId" and I'm rendering "vehicleName" or i'ts the expected behavior?

Here's an example -> https://share.getcloudapp.com/xQuvqK9D

Please break it up in a separate thread. It's hard to support long threads. Only one question per thread is allowed. Please do not forget to attach a runnable testcase or detailed instructions of how to reproduce with our demos. How to ask for help is described here: viewtopic.php?f=35&t=772

Cheers,
Pavel