Skip to main content

Open a Popup or even a window from a page with the model being used by a chart so far i have been able to open a new page from a script on the click of one of my charts however i want the page i open to have the same model used for the chart is there a way to do this with a generic page or even popup which show all fields in the visualization or even if i have to manually configure/pass the fields


this is as far as i have gotten with my javascript


(function(skuid){ ``` var $ = skuid.$;

 //var myModel = skuid.model.getModel('MyModelId');

 //var myComponent = skuid.component.getById('MyComponentUniqueId');

 console.log("Chart element: " + document.getElementById("highcharts-4"));

 console.log(document.getElementById("highcharts-4"));

 window.onload = function(){

 var chart = document.getElementById("highcharts-4");

 console.log("Chart element: " + document.getElementById("highcharts-4"));

 console.log(document.getElementById("highcharts-4"));

 chart.onclick = function(){

 console.log(window);

 window.open("www.google.com",'_blank');

 }

 };

})(skuid);

Take a look at this forum post: 
https://community.skuid.com/t/trigger-popup-from-javascript

The most straightforward thing to do will be to have the popup triggered from clicking on the dom element contianing the chart.  Then have the popup call a page include (so you don’t have to write the xml for the popups contents manually).  In that include you can have the model repeated and (use a different model name) and show the table. 

Does that mean that i would have to design a page/model for each graph to be shown in the page include because i wanted a generic page that could accept any model/data to create a page

Also how would i go about getting the relevant model from the dom element to display on the popup

I’m not sure you will be able to create a generic page that can be used across multiple models.  You will need to define the models and the fields for the chart and table on each page. 

But you can make all this work on one page if you are wiling to include the XML for the table generation in your Javascript that generates a popup.  You could build out the Table elsewhere in your page,  go to the XML view (Bottom right of the builder page) and then copy the table section into your Javascript. 

Thats what i was planing to do generate the xml programatically however i am having issues trying to get the relevant model from the chart. so that from my inline code i grab the relevant model of the chart that was just clicked on.

Getting the Model name for the chart at hand is going to be tricky. You can get the xmlDefinition that builds the chart through our Component API. If you wrap the chart in a panel and give that panel and ID - you can get more granular about the component definition you are targeting.


Below is a picture of the component definition in the console. You will be interested in the “nodeValue” attribute.



This is not standard development. And as such I’m not sure we are going to be able to dig much deeper. Buy you seem willing to tackle a hard question. Enjoy.

I have gotten the model name now i need a way to trigger the onclick event via the  element how do i do this using this skuid component?

As Each graph has varying model’s i will have to register a different popup for each graph however i dont want a large if statement how do i achieve this?

I would reccomend using the “before render snippett” feature to add onclick behavior to the chart.  

how is the element defined in the before render snippet space

View our Community Site Map

Nintex Community Sitemap
Terms & ConditionsCookie settings