Despite the COVID-19 outbreak, our team continues operating at full speed. We are always here to support and answer all your questions.

Feel free to reach out by filling this quick form.

Fill the form
Get Free Trial

How to add a custom dropdown on each cell column for Vue boostrap framework

Answered
Michel Roger asked on October 13, 2020

Hello Team,
 
I am working on a POC for our department, I would like to know how to put together a report where each row can have an action button which it is a list of events for that row, a dropdown will be an effective component on this case. We are using Vue and bootstrap-vue for our applications, it will be nice to see an integration or example how to put together that kind of events on flexmonster.

3 answers

Public
Vera Didenko Flexmonster October 15, 2020

Hello, Michel,
 
Thank you for reaching out to us. 
 
Flexmonster has a built-in context menu feature that can be opened by right-clicking on a grid cell or chart element. The context menu provides a list of actions that can be performed on the corresponding element. Moreover, you can customize the context menu to provide new functionality. This includes removing/editing existing options or adding new options to the list.
For more information, please see the following guide.
 
We hope such an approach would work for your case.
Please feel free to reach out in case of questions.
 
Kind regards, 
Vera

Public
Michel Roger 7 days ago

thats an awesome feature, but it is kind of hiding for the user, we would like to have something more in your face in order to drive the user experience. can you suggest based on my request I saw previous post about making it work for angular and plan html. I was wondering if you guys something already made for bootstrapVue for each row dropdown.
 
Michel  

Public
Vera Didenko Flexmonster 3 days ago

Hello, Michel, 
 
Thank you for your response. 
 
We would like to kindly explain that at the moment we don’t have an example using bootstrapVue.
However, we have a sample Vue project on GitHub showing how the customizeCell API call can be used to customize the grid. You are welcome to check it out by the following link. In addition, more details about cell customizing are provided in the following guide.
 
Our team would like to mention that heavy grid customizations could affect the overall performance. With that in mind, we recommend considering the idea of adding such controls outside the pivot table and using the Flexmonster API for providing the required functionality. 
 
Please let us know if you have any other questions that we can help you with.
 
Kind regards, 
Vera

Please login or Register to Submit Answer