PP.TS.Ui.X11EquationWizardView (settings);
settings. JSON object that contains values of component properties.
The X11EquationWizardView constructor creates an instance of the X11EquationWizardView class.
Example execution requires a workbook with the 1583 key.
In the HEAD tag of HTML page specify links to the following JS files:
PP.Metabase.js.
PP.Express.js.
PP.TS.js.
PP.js.
Add the following code to ensure that the example is correctly displayed in various browsers:
<script type="text/javascript"> if (window.devicePixelRatio == 2) // Retina PP.scriptManager.loadStyles(["../build/PP.retina.css", "../build/PP.App.retina.css", "../build/PP.Express.retina.css", "../build/PP.TS.retina.css", "../build/PP.Metabase.retina.css"]); else if (PP.IsIE && PP.IEVer < 8) // Old IE PP.scriptManager.loadStyles(["../build/PP.css", "../build/PP.App.css", "../build/PP.Express.css", "../build/PP.TS.css", "../build/PP.Metabase.css", "../build/PP_IE7.css"]); else // All other PP.scriptManager.loadStyles(["../build/PP.css", "../build/PP.App.css", "../build/PP.Express.css", "../build/PP.TS.css", "../build/PP.Metabase.css"]); </script>
In the <body> tag as value of the onLoad attribute specify name of the function executed after page body loading is completed, and the code that defines component appearance:
<body onselectstart="return false" class="PPNoSelect" onload="Ready()"> <div class="PPSlidePanel LeftSided PPWorkbookSlide PPC"> <div class="PPNavigationBar PPC PPTSNavBread" style="width: 302px;height: 400px;"> <div class="Layout"> <div class="PPNavItm PPC"> <div class="PPNavItemView"> <div class="PPScrollBox PPC"> <div class="PPScrollContent"> <div class="PPNavItemContent"> <div class="PPPanelContent" id='example' style="width: 250px;height: 550px;"> </div> </div> </div> </div> </div> </div> </div> </div> </div> </body>
In the end of the document insert code that will set styles corresponding to client's OS to the document.body node:
<script type="text/javascript"> PP.initOS(document.body); </script>
In the SCRIPT tag add the following script:
<script type="text/javascript"> // Determines language settings for resources PP.setCurrentCulture(PP.Cultures.ru); var ctrl; function Ready() // body loading event handler { waiter = new PP.Ui.Waiter(); metabase = new PP.Mb.Metabase({
Id: "PPRepository", UserCreds: { UserName: "user", Password: "password" }, StartRequest: function() { waiter.show(); }, EndRequest: function() { waiter.hide(); },
Error: function(sender, args) { alert(args.ResponseText); } }); // Open repository connection metabase.open(); var tsService = new PP.TS.TSService({ Metabase: metabase }); var key = 5183; // Workbook key var wbk; tsService.openDocument(key, onFirstOpened); function onFirstOpened(sender, args) {
var wbk = args.Workbook; // Create seasonal adjustment wizard equation = new PP.TS.Ui.X11EquationWizardView({ Source: wbk, IsRTL: false, ControlChanged: new PP.Delegate(onStateChanged) }); // Add to "example" to the DOM node equation.addToNode("example");
state = equation.getCurrentState(); equation._onControlChanged(); /* Component change event calls component change event handler */ function onStateChanged(sender, args) { currentState = equation.getCurrentState(); console.log(currentState); } } } </script>
After executing the example the seasonality selection wizard is placed on the HTML page. On component state change the browser console displays a JSON object that contains component state, followed with an appropriate message.
See also: