Aize
Posts: 6
Joined: Mon Apr 30, 2018 11:08 am

How to display viewData option in a modal?

Hello,
I'm working with HighStock and with export-module enabled. There is a menu item to view the data table with the option "viewData".
It displays correctly the datatable but no way to "hide" the table. So, I thought I could make a modal window which appear by clicking on the export option "View data table" and that display the data table in it.
I know how to create a custom option and display the data table, but I can't find a way to change the value of renderTo for the viewData so I can display it in a div I created in the modal.

Any help will be usefull.

Regards,
Attachments
viewData.png
viewData.png (6.15 KiB) Viewed 3333 times
rafalS
Posts: 2665
Joined: Thu Jun 14, 2018 11:40 am

Re: How to display viewData option in a modal?

Hi, Aize!

Before I answer your specific question - is not that what you've been looking for?

https://jsfiddle.net/BlackLabel/5tLojrhb/

Best regards!
Rafal Sebestjanski,
Highcharts Team Lead
Aize
Posts: 6
Joined: Mon Apr 30, 2018 11:08 am

Re: How to display viewData option in a modal?

Hi Rafal many thinks for you reply.

In your example, it's not enough because I have many charts on the same page. I want to control the "view data table" to limit append impact to other charts by opening a dedicated modal. If you can help on it :)
rafalS
Posts: 2665
Joined: Thu Jun 14, 2018 11:40 am

Re: How to display viewData option in a modal?

Aize,

I still don't understand what exactly you want to achieve. Could you visualize this or send me a simplified jsFiddle demo with your charts so I can work on the specific situation?

Best regards!
Rafal Sebestjanski,
Highcharts Team Lead
lorikay4
Posts: 3
Joined: Fri Oct 25, 2019 3:26 pm

Re: How to display viewData option in a modal?

rafalS, Aize is saying they want the following to happen: when a user clicks to make the datatable visible, the datatable appears inside a modal box, rather than being rendered inline into the page. And the modal box should have a closing button, so that it can be closed without the user having to refresh the page to make the datatable go away.
rafalS
Posts: 2665
Joined: Thu Jun 14, 2018 11:40 am

Re: How to display viewData option in a modal?

Hi,

Welcome to our forum and thanks for explaining! Now I get it and it makes a sense.

Unfortunately, our export-data.js module provides only the main HTML table structure with data - styling it and displaying differently from the current behavior is on the user's side.

I can tell you where can you get the HTML table with data from, but if you want to create a separate modal window, you need to write it from scratch. Of course, you can also simply create a button that will close the modal.

If you think that it should be included in Highcharts code, please create a ticket on our UserVoice channel - we will implement this if it gets enough votes.
https://highcharts.uservoice.com

Let me know if you have any further questions.

Best regards!
Rafal Sebestjanski,
Highcharts Team Lead

Return to “Highcharts Usage”