[VUE 2] Custom column cell merge

[Webethics]

Hello ,

I've created a custom column for loading additional text.

nextButton = {
                    type: 'action',
                    autoWidth: true,
                    mergeCells : true,
                    field:'Load',
                    actions: [{
                      renderer: (data) => {
                        return `<p class="b-action-item load_more"> Load More</p>`;
                      },
                      onClick: (event) => {
                        this.addNextRecord(event);
                      },
                      tooltip: 'Load More',
                    }]
                  }

Now, I am to merge the cell containing the "load more" text. However, when attempting to merge cells using the mergeCells function, I encounter the error: "Error in mounted hook: 'Error: Feature 'mergeCells' not available, make sure you have imported it'".

Could you please assist in identifying why this error is occurring?

[ghulam.ghous]

Hi there,

You need to import it inside your file from vue-wrapper. You can do this in the following manner:

import { MergeCells } from '@bryntum/grid';

Hope it helps!
Regards
Ghous

[Webethics]

I added it in the same file where I imported the grid but it didn't work

import { Grid,  MergeCells } from 'bryntum-grid';

[ghulam.ghous]

Hi there,

Can you please share a runnable test case where we can see what's wrong?
I have tested it again and it does not require to event import it. See the Vue2 attached demo and clip:

https://drive.google.com/drive/folders/12awWNZlRgM7ZC4Ag17VOSIYwctsYyj0b?usp=sharing

advancedgrid.zip

(266.81 KiB) Downloaded 15 times

Use:
npm install
npm start

to run project.

[Webethics]

When I utilize the example code, the MergeCells functionality works fine.
https://drive.google.com/drive/folders/1N2_KRAArZnaG_7oX1UuE1s02mqaqEiWP?usp=sharing
However, upon integrating it into my project, I encountered an error.

[ghulam.ghous]

Can you share the codepen link with us so we can debug this issue and assist you? Because I really can't say what is wrong without looking at your code?

[Webethics]

https://codepen.io/details-wes/pen/JjVyJMY?editors=101

[ghulam.ghous]

Hi there,

Thanks for sharing the link. I have checked and there are no errors, mergeCells working correctly on the Load More Column. See the clip here: https://drive.google.com/file/d/1yRCgpmQStOxNUMLRvi4Md4B9Ju-P85Uq/view?usp=sharing

Here is the screenshot with no errors:

Screenshot 2024-03-27 at 5.25.22 PM.png (468.35 KiB) Viewed 259 times