Now we should be able to build the project successfully.  Browse the generated code and you can find the OnRequest method we have a switch case for mapping different commands from HMI. We replace ” YOUR_MAPPING” with a suitable command string in the following snippet.

switch (command.Mapping)
{
    // case "YOUR_MAPPING":
    //     Handle command
    //     break;
    default:
    command.ExtensionResult = ServerExtensionCSharpEmpty1ErrorValue.ServerExtensionCSharpEmpty1Fail;
    command.ResultString = "Unknown command '" + command.Mapping + "' not handled.";
    break;
}

A different version of the wizards creates a different type of code. The version we are using here is 1.12.752.0. In the previous version, it was generating a bit different code but the idea is the same, so be aware of that.

At this phase, if we want to compile the project that should be compiled perfectly though it does not do much!

To make it a bit useful to our needs, we need to change these or add some switch cases. Under the config folder, we have xx.Config.json (xx is your project name).  We can edit the symbols. The wizards have created the following JSON code. We add our command inside the symbols.

{
  "$schema": "ExtensionSettings.Schema.json",
  "guid": "8e25d4f4-d586-4006-845b-a6b9fc1c4579",
  "version": "1.0.0.0",
  "configVersion": "1.0.0.0",
  "policies": [
    "StrictPropertyValidation"
  ],
  "symbols": {}
}

We shall use the following commands’ names inside the symbols. We are using the same sample which we have described on the page https://www.hemelix.com/scada-hmi/twincat-hmi/data-grid-view/,  see figure 3 to understand what we are talking about.

    "GetDataValue": {
      "readValue": {
        "$ref": "tchmi:general#/definitions/String"
      },
      "hidden": false
    },
    "WriteValueInit": {
      "readValue": {
        "$ref": "tchmi:general#/definitions/String"
      },
      "hidden": false
    },
    "WriteValueDelete": {
      "readValue": {
        "$ref": "tchmi:general#/definitions/String"
      },
      "hidden": false
    },
    "WriteValueAdd": {
      "readValue": {
        "$ref": "tchmi:general#/definitions/String"
      },
      "hidden": false
    }

STEP 03: If the project was compiled successfully, the extension can be loaded from the server. So we need a reference for the extension from the HMI project.

HMI Project References | Add References | Select the extension.

STEP 04: 

Let’s fill the switch case with our symbols which we added in the previous steps. We shall pass these strings from our JavaScript call from the HMI. And it depends on our requirements and what we write in these switch cases.

 private void OnRequest(object sender, TcHmiSrv.Core.Listeners.RequestListenerEventArgs.OnRequestEventArgs e)
        {
            try
            {
                e.Commands.Result = ServerExtensionCSharpEmpty1ErrorValue.ServerExtensionCSharpEmpty1Success;
                foreach (Command command in e.Commands)
                {
                    try
                    {
                        // Use the mapping to check which command is requested
                        switch (command.Mapping)
                        {
                            case "WriteValueInit":
                                break;
                            case "WriteValueDelete":
                                break;
                            case "WriteValueAdd":
                                break;
                            case "GetDataValue":
                                break;
                            default:
                                break;
                        }
                    }
                    catch (Exception ex)
                    {
                    }
                }
            }
            catch (Exception ex)
            {
                throw new TcHmiException(ex.ToString(), ErrorValue.HMI_E_EXTENSION);
            }
        }

STEP 05:

Bring the HMI Configuration menu as shown in the following figure for mapping those variables.