Our pure JavaScript Scheduler component


Post by kundansah »

Hi Bryntum Team,

I have a requirement to expand the tree group dynamically based on when user searches a topic

Tree Group 2024-03-26 072959.png
Tree Group 2024-03-26 072959.png (24.78 KiB) Viewed 254 times

let groupResourceNodeData = parentGroups.map((n) => {
    if (n.key === "solution_area") {
      let solutionAreaGroups = uniqueSolutionAreas.map((solutionArea, index) => {
        let solutionAreaTopics = intialSolutionArea.filter((m) => m.solution_area === solutionArea)

    if (solutionAreaTopics.length > 0) {
      let topicNode = {
        id: solutionArea + index,
        name: solutionArea,
        children: solutionAreaTopics,
        expanded: false,
      };
      return topicNode;
    } else {
      return null; // Exclude empty groups
    }
  }).filter(Boolean); // Remove null entries

  let parentNode = {
    name: n.name,
    id:n.key,
    children: solutionAreaGroups,
    expanded: false,
  };
  finalArrays.solutionArea.push(parentNode);
} 

above is treegroup code.

below is agenda config.js file

 columns: [
            {
              field: "name",
              text: "Search Topic",
              type: 'tree',


          filterable: {
     
            filterFn: ({ record, value }) => {
          
              let returnVal =
                record?.name
                  ? record?.name
                    ?.toLowerCase()
                    ?.indexOf(value.toLowerCase()) !== -1 : false || record?.keywords
                    ? record?.keywords
                      ?.toLowerCase()
                      ?.indexOf(value.toLowerCase()) !== -1
                    : false || record?.solution_area
                      ? record?.solution_area
                        ?.toLowerCase()
                        ?.indexOf(value.toLowerCase()) !== -1
                      : false || record?.industry
                        ? record?.industry
                          ?.toLowerCase()
                          ?.indexOf(value.toLowerCase()) !== -1
                        : false || record?.description
                          ? record?.description
                            ?.toLowerCase()
                            ?.indexOf(value.toLowerCase()) !== -1
                          : false;
              console.log(returnVal)

Post by alex.l »

Hi,

You was about to suggest you to use https://bryntum.com/products/gantt/docs/api/Grid/view/GridBase#function-expand
but it didn't work with that feature. I've opened a ticket to fix that https://github.com/bryntum/support/issues/8892

All the best,
Alex


Post by alex.l »

Hi,

Did you use TreeGroup at all? I see no related code in your snippets. Could you please provide a complete example? Use one of our demos as a base and apply required changes.

Thanks.

All the best,
Alex


Post by alex.l »

I tested it better and found that expand/collapse does work, you just need to call it on gantt level:

gantt.expand(record);

You can use it in your solution. I will close a ticket.

All the best,
Alex


Post Reply