Our state of the art Gantt chart


Post by Rakesh Nagapuri »

{
          type: 'name',
          text: '',
          width: 2,
          field: 'name',
          align: 'center',
          expandIconCls: 'row-expanded',  // css for expandIcon
          collapseIconCls: 'row-collapsed', // css for collapseIcon
          renderer: (data: any) => {
            if (data.record.originalData.firstColumnIcon) {
              return `<img src="${data.record.originalData.firstColumnIcon}"/>`; // Additional Icon
            } else {
              return ''';
            }
          },
        }

I am trying to do something like this for the column. The expand icon is populated correctly but the icon in the renderer is not populated.
On inspecting found that it is going inside the if block but still icon is not populated. Instead of Icon a text is populated which is something like this
"<img src ="icon ref"/>"
If I remove the double quotes, the image is correctly placed adjacent to the expander. Is there mistake done in returning the value from the renderer. Please check


Post by alex.l »

Hi,

First of all, you need to disable https://bryntum.com/products/scheduler/docs/api/Grid/column/Column#config-htmlEncode
Another thing is to get value from record field, you don't need to use originalData, just record. firstColumnIcon.
Make sure you extended ResourceModel with this field, it's also required https://bryntum.com/products/scheduler/docs/api/Scheduler/model/ResourceModel#fields-and-references

If it doesn't work after you fixed all these moments, please apply minimal changes to one of our examples to make it reproducible and attach the app here. Or just share your app if it's applicable, and we will help you with that.

All the best,
Alex


Post by Rakesh Nagapuri »

Thanks alex, disabling the htmlEncode did the magic.


Post Reply