ParametersPanel Constructor

Syntax

PP.TS.Ui.ParametersPanel(settings);

Parameters

settings. JSON object that contains values of component properties.

Description

The ParametersPanel constructor creates an instance of the ParametersPanel class.

Example

To execute the example, create an HTML page and perform the following operations:

1. Add links to the following CSS files:

 Add links to the following JS files:

The workbook with the 5183 key should also be available.

2. In the SCRIPT tag add the following script:

<script type="text/javascript">
// Determine language settings for resources
		PP.setCurrentCulture(PP.Cultures.ru);
		// Declare constants
		var KEY = 5183; //document key
		
		// Declare variables
		var waiter, metabase, tsService, wbk, parametersPanel, navbar;
		
		//Function for getting handler functions
		//Gets additional information as a parameter that is displayed to the console on calling the handler.
		//It can be, for example, a string containing class and event names
		function onDummyActionFactory(actionCaption){
			return function (sender, args){
				console.log(actionCaption);
				console.log(sender);
				console.log(args);
			};
		}
		
		
	 	function Ready() { //"body" loading event handler
	 	// Create loading indicator
			waiter = new PP.Ui.Waiter();
			// Create repository connection
			metabase = new PP.Mb.Metabase(
			{
			 Id: "pmart_ms",
			 UserCreds: { UserName: "sa", Password: "H88cp229" },
			 StartRequest: function () {
			 	waiter.show();
			 },
			 EndRequest: function () {
			 	waiter.hide();
			 },
			 Error: function (sender, args) {
			 	alert(args.ResponseText);
			 }
			});
	 	// Open repository connection
			metabase.open();
	 	// Create a service for working with time series
			tsService = new PP.TS.TSService({ Metabase: metabase });
	 		tsService.openDocument(KEY, onFirstOpened);
	 	// Document open event handler
			function onFirstOpened(sender, args) {
	 		wbk = args.Workbook; //workbook
				
				// Create instance of parameters panel class
				parametersPanel = new PP.TS.Ui.ParametersPanel({
					Source: wbk, //data source
					//properties panel group identifier
					GroupName: PP.TS.Ui.PropertyGroups.Parameters,
					ResourceKey: "WorkbookPropertyParameters", //resource key
					ViewType: PP.Ui.NavigationItem,
					IsHeaderControlVisible: false,
					ControlChanged: PP.Delegate(onDummyActionFactory("outputSerieWizardView ControlChanged"), this)
				});
				
				navbar = new PP.Ui.NavigationBar({
					ParentNode: "example",
					Width: 400,
					Height: 800,
					VisibleAreaHeight: 810,
					ShowBorders: true,
					IsAlwaysExpanded: false
				});
	 			navbar.addItem(parametersPanel);
	 			console.log("Set workbook, which data is displayed in component");
	 			var value = args.Workbook;
	 			parametersPanel.setSource(value);
	 		}
	 }
	</script>

3. In the <body> tag as the value of the onLoad attribute, specify name of the function executed after page body loading is completed:

<body onselectstart="return false" class="PPNoSelect" onload="Ready()" style="margin: 0px">
	<div id='example'></div>
</body>

4. At the end of the document insert a code that sets styles corresponding to client's operating system, to  the document.body node:

<script type="text/javascript">
    PP.initOS(document.body);
</script>

After executing the example an instance of the ParametersPanel class instance is placed on the HTML page. Data of the workbook with specified key is set for this instance.

See also:

ParametersPanel