+1 on the idea. Basically do not use the ID attributes within Handlebar templates since it is a template and there can be multiple instances. Simply generate necessary markup using a template, do the necessary modifications and then push the modified content into the parent DOM. Then run the script to draw the chart.
*Lasantha Samarakoon* | Software Engineer WSO2, Inc. #20, Palm Grove, Colombo 03, Sri Lanka Mobile: +94 (71) 214 1576 Email: [email protected] Web: www.wso2.com lean . enterprise . middleware On Wed, Apr 19, 2017 at 8:37 PM, Udara Rathnayake <[email protected]> wrote: > > While working on the new dashboard UUF component we noticed, there can be > ID conflicts due to the lack of widget isolation. > > Eg:- > In a widget hbs we declare a simple div so later we can append/draw the > widget content(graph etc..) > >> <div id="bar"></div> > > > Then we provide data and config to the VizGrammar library and then draw > the content inside above defined div. > > >> var lineChart = new vizg(data, config); >> lineChart.draw("#bar"); > > > *Problem* > > With this approach one can't have multiple instances(with different > data-source/configs) of the same bar-chart widget. > > We evaluated some technologies like web-components, shadow-dom in-order > to overcome this. > Shadow-dom is a viable solution but with the current implementation of > VizGrammar we can't directly go with that[1]. > > > > *Current solution* > As we identified, most of the time above problem can occur with the > widgets generated through the widget-gen tool where end-users use the same > templated widget to create multiple instances. Simplest way to solve this > is to have a placeholder when we define the div ID and within the script, > then dynamically replace this placeholders with the widget-id(or some other > unique value) during widget generation process. > > [1] Creating a widget web-component using existing charting libraries > > -- > Regards, > UdaraR > > _______________________________________________ > Dev mailing list > [email protected] > http://wso2.org/cgi-bin/mailman/listinfo/dev > >
_______________________________________________ Dev mailing list [email protected] http://wso2.org/cgi-bin/mailman/listinfo/dev
