Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Overview

This technical note has information related to how to call a class on HTML5 (@Script.Class.<ClassName>). 

On this page:

Table of Contents
maxLevel3
stylenone


How to Use

The problem

Framework does not allow to call a class on HTML5

It is not possible to call @Script.Class using default method that is used on WPF Pages.

ExampleImage Modified

You can see that there is no option to call a class. The following topic shows how to make it possible.

The

solution

Implementation

The implementation

To make the call of classes on a HTML5 page possible, it is necessary to execute a code behind where a TK.ExecuteClassMethodOnServeris called.

Example 1

You can see an example of the implementation:

Code Block
languagejs
titleCodeBehind Example
linenumberstrue
this.MouseLeftButtonDown1 = function(sender, e)
{
	    var parameters = new Array("Tag1");
	    var result = TK.ExecuteClassMethodOnServer("TagDescription", "Func", parameters);
}
   

Where:

  • TagDesciption:
Edit →
  • Scripts → Classes → "Class Name"
  • Func:
Edit →
  • Scripts → Classes → "Class Name" → "Function Name"
  • Parameters: Tag passed as parameter

You can see in the Code Block below an example of the Script implementation calling the function "func":


Code Block
languagec#
titleScript Example
linenumberstrue
public string Func(String TagName)
{
	    string tag = TagName;
   
	 return tag + TK.GetObjectValue("Tag." + TagName + ".Description");
}    

In our case, it will return the Tag Name and its description. Following those steps you can call a Class from HTML5.

The solution example


Example 2

The implementation example 2

You can run a Task or a Class through an HTML5 page. However, since the majority of the scripts are .NET and will run on the Server and not directly on the Client, follow the steps below

:

.

When creating a Task or Class, you need to set the "Domain" column to the Server option. When creating the Tags that will go inside the Task or Class, you need to create them with the Server type Domain as well.

To activate a Task, you need to create a preferably Digital type tag that will serve as a Trigger as in the image below:

Image Removed

Image Added

On the HTML5_MainPage display, we have a button called "Trigger Task" which is set to perform a toggle directly on the Tag previously configured in the Task Trigger. 

Each time the button is pressed, the task will run on the Server.

Image Removed

Image Added

To use a Class, it is necessary to use the TK class and the ExecuteClassMethodOnServer() method.

There are three parameters that must be passed to this method. The first parameter is the name of the class created in

Scripts>Classes

Scripts/Classes, this parameter is a String. 

The second parameter is the name of the method created within the Class, this parameter is also a String. And the Third parameter are the parameters that can be passed to this class, or can be left as null, the passed parameters need to be Array type.

Here is the syntax for the method:

Image Removed

Code Block
languagec#
titleC# Syntax
public static object ExecuteClassMethodOnServer( 
   string className, 
   string methodName, 
   object[] parameters 
)

In the

image

code block below we have a class called PublishClass and two methods

,

: the Main method, which does not receive any parameters and does not return anything, and the ReturnValue method, which receives a string as a parameter and returns a string.

Code Block
languagejs
titleJS Examples
this.CallClass = function(sender, e)
{
	TK.ExecuteClassMethodOnServer("PublishClass", "Main", null);
}


this.CallClassWithReturn = function(sender, e)
{
	var parameter = new Array("Value 01");
	@Tag.ResultClass = TK.ExecuteClassMethodOnServer("PublishClass", "ReturnValue", parameter);
}

Image Removed


To call each of the methods mentioned above, we use the following code in the

Codebehind

Code Behind of an HTML5 page

:

.

Within the CallClass function we call the Main method, and within the CallClassWithReturn function we call the ReturnValue method.

Image Removed
Code Block
languagejs
public void Main ()
{
	Tag.TagClassValue += 1;
	@Info.Trace ("TEST | | Main Class");
}

public string ReturnValue(string msg)
{
	string result = "msg: " + msg;
	@Info.Trace("TEST | | Return Class");
	return result;
}


These two functions are called through the Actions of the buttons created in the HTML5_MainPage display as shown in the image below:

Image Removed

Image Added


In this section

...

:

Page Tree
root@parent
spacesV10