Our state of the art Gantt chart


Post by vconstruct »

Hi Team,

Is it possible to define a region when specifying selection mode for checkbox column, the problem is we are using selection mode object to render our checkbox column but we are not sure how to prevent it from being scrolled out of view.

Thanks,


Post by tasnim »

Hi,

the problem is we are using selection mode object to render our checkbox column but we are not sure how to prevent it from being scrolled out of view.

Could you please show the code and a video or an image that it's scrolled out of view?


Post by Animal »

There can be as many grid "regions" as you like. Not only locked and normal. They are layed out in alphabetic order.

As of now, you can postprocess the gantt after it has initialized like this:

Screenshot 2023-03-09 at 07.32.38.png
Screenshot 2023-03-09 at 07.32.38.png (115.03 KiB) Viewed 767 times

See how it is its own seperate scrolling subgrid. Right now, it seems you cannot prevent it from having a splitter to be resizable. I think that is a bug. If you can live with this for a while, we can fix it.

You should be able to configure the gantt with

    selectionMode : {
        checkbox : {
            region : 'checkbox'
        }
    }

But somehow that doesn't work. I think this is a bug and will consult my colleagues about it.


Post by Animal »


Post by vconstruct »

Hi,

Thanks for the response we tried passing the region inside the selection mode object but that doesnt really do anything i can still scroll . Moreover now when we try to check a checkbox we get an error (I have attached the error as an attachment).

We provided a subgrid prop in the bryntum gantt react component :

subGridConfigs = {{
              fixed : {
                  resizable : false,
                  weight    : 1
              },
              locked : {
                  width  : 400,
                  weight : 2
              }
            }}

After adding this to the code selecting a checkbox simply throws an error so defining any region is not possible for us because of the error.

Attachments
2023-03-09_17-35-29.png
2023-03-09_17-35-29.png (143.18 KiB) Viewed 757 times

Post by vconstruct »

Hi,

We noticed one more issue when we try to add a region to any other column besides checkbox column, the checkbox column stops rendering the checkbox, we have attached a screenshot of the same.

we used the following column def:

	const columnDef = [
		 {
      type: 'statuscolumn',
      region : 'checkbox',
      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
      // @ts-ignore
      renderer({ record }) {
        const emptyString = " ";
        if(record._data.status){
          return record._data.status
        }
        else {
            return emptyString
        }
    }
	]

This is the selection mode config that we use to render the checkbox column :

	  const selectionMode = {
    row : false,
    cell : false,
    rowCheckboxSelection : true,
    multiSelect : true,
    checkbox : true,
    showCheckAll : true,
    deselectFilteredOutRecords : true,
    includeChildren : true,
    preserveSelectionOnPageChange : true,
    preserveSelectionOnDatasetChange : true,
    deselectOnClick : true,
  }

we have already shared the subGridConfig in the previous message.

Please let us know if we are missing something or is this a bug

Attachments
2023-03-09_17-51-31.png
2023-03-09_17-51-31.png (34.04 KiB) Viewed 754 times

Post by mats »

This one I can't reproduce, would you be able to upload a runnable test case with every config?


Post by vconstruct »

Hi Mats,
Apologies for the delay, we had our hands full with some production work, yes we can create a runnable test code and share it with you guys.

will get back to you guys asap


Post by vconstruct »

Hi,
Following up on this, we are still facing the following issues relating to this topic.

  1. Like the implementation in the Bryntum Gantt example for 'Fixed Columns', we created two regions (Fixed and Locked), but when we load a project we get an error message saying 'Cannot read properties of undefined (reading 'normal')'. It seems like when we specify the subGridConfigs, 'normal' region is required?
    Please see snapshot (
    undefined (reading 'normal').png
    undefined (reading 'normal').png (41.72 KiB) Viewed 588 times
subGridConfigs={
          {
            fixed: { 
            resizable: false,
            weight: 1 
          },
          locked : {
          // A scrollable section with the main columns
          width  : 400,
          weight : 2
          }
          }
        }
  }
  const columnDef = [

{ region: 'fixed',
  type: 'activityidcolumn',
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
  // @ts-ignore
  renderer({ record }) {
    const emptyString = " ";
    if(record._data.activityid){
      return record._data.activityid
    }
    else {
        return emptyString
    }
  },
  text: 'Activity Id',
}]
  1. If we define two regions (Fixed and Normal), it gives an error message saying 'Id b-gantt-5-normalSubgrid already in use'.
    normalSubgrid already in use.png
    normalSubgrid already in use.png (50.46 KiB) Viewed 588 times
subGridConfigs={
          {
            fixed: { 
            resizable: false,
            weight: 1 
          },
            normal: { 
              width  : 800,
              weight : 2
            }
          }
        }

Post by alex.l »

Hi,

What version of Gantt are you using? Try to upgrade? Are you able to reproduce that in our online examples?
Am I right you defined 2 regions and only 1 column? It will helps a lot if you attach runnable code here with instructions how to launch the app. I see it's working well online here https://bryntum.com/products/gantt/examples/fixed-columns/

All the best,
Alex


Post Reply