Bryntum Support Forums

in gantt we have defined these columns (ignore the "" as this is a configuration object in our system)

[
      {
        "renderer": () =>{
            return [{tag       : 'img',className : 'avatar',src       : object.value}];
        },
        "field": "icon",
        "hbSource": "attribute",
        "width": 90,
        "text": ""
      },
      {
        "field": "classIdentifier",
        "hbSource": "attribute",
        "width": 15,
        "text": "(ID)",
        "align": "center"
      },
      {
        "editor": false,
        "field": "objectName",
        "hbSource": "attribute",
        "width": 250,
        "text": "objectName",
        "type": "name"
      },
      {
        "field": "select",
        "hidden": false,
"alwaysClearCell":false,
        "flex": 1,
        "renderer": () =>{
            if (object.record.classIdentifier === '(OP)'){return ''};
        },
        "text": "select",
        "type": "check",
        "align": "center"
      },
      {
        "width": 70,
        "showCircle": true,
        "type": "percentdone"
      }]
      

if we load the gantt we have the situation see attachment before-scroll
if we scroll down and up, some or all of the checkboxes are lost, see 2nd attachment

Hey pincherhgz,

Could you provide some samples of data for us to check? If you could also change one of our demos and update your configuration, that would be very helpful for us to assist you.

see attached project (manipulated example) + data used (the renderer is just a fake to have some different appearance)

Hi,

Thank you for the test case. I found the only problem in the code you posted. You used record.originalData.percentDone which is not correct way to get current value. It should be record.percentDone. When I changed that, I see no problems with check column appearance.
I also don't see any lags on scroll: I always see same amount of checkboxes.

Another moment, please see docs to find the correct way how to hide checkbox widget: https://bryntum.com/products/gantt/docs/api/Grid/column/CheckColumn#snippet

For your case, I also see you compare strings in wrong way. Please check this article https://www.freecodecamp.org/news/javascript-string-comparison-how-to-compare-strings-in-js/

we changed to

        renderer: (object) =>{
            if (object.record.percentDone < 50){return ''};
        },

but the problem is still there, please look at the attachments

by the way , you mentioned

For your case, I also see you compare strings in wrong way. Please check this article

the code above is the only code we added to your standard example

renderer: (object) =>{
            if (object.record.percentDone < 50){return ''};
        },

Change to that you always return a string?

sorry, I do not understand the question, our problem is the lost checkbox on scrolling. If this renderer is wrong, please instruct how to do that

we also changed to

renderer: (object) =>{
            if (object.record.percentDone < 50){
                object.widgets[0].hidden = true;
            };
        },

as advised by Marcio, but the same, scroll down and up, boxes are lost

finally we found this as a stable solution:

renderer: (object) =>{
            if (object.record.percentDone < 50){
                object.widgets[0].hidden = true;
            } else {
                object.widgets[0].hidden = false;
            }
        },

Glad to hear you fixed it. Good luck!