How to create EGX300 custom web pages with multiple devices (two methods: PL Tags and XMLHttpRequest)

Issue
There are 2 methods for creating custom web pages for devices on the EGX300.
1. "PL Tags"
2. XMLHttpRequest

Product Line
EGX300

Environment
EGX300 web page
Text Editor (HTML and JavaScript)
Modbus Register Maps

Cause
When adding devices and register to the web pages, the user will need to use one of the 2 methods. The code will vary depending on the method chosen for the webpage.

Resolution
*Warning: Take backups of any files prior to modifying them. Ensure the backups are in a location that will not be overwritten (i.e. the Desktop,etc.).

method one "PL Tags":

• These are Server Side Includes (proprietary) that the server uses to read data from device as it serves the page to the host (browser).
• Can cause the page to load slowly if read request is directed to non-responding device, or if several read requests are made from within the page
• Requires webpage to be reloaded to update data
• Easy to use

Example using PL Tags for two meters
RegisterSet1 = [PL__3^3209,3210,3211,3208,1180,1100,1103,1104__PL]; //device with unit ID 3
RegisterSet2 = [PL__5^3209,3210,3211,3208,1180,1100,1103,1104__PL]; //device with unit ID 5

//device 3
dev3_ScaleFactorA = RegisterSet1[0]; // Current Scale Factor
dev3_ScaleFactorB = RegisterSet1[1]; // Neutral Current Scale Factor
dev3_ScaleFactorC = RegisterSet1[2]; // Ground Current Scale Factor
dev3_NominalFrequency = RegisterSet1[3];
dev3_Frequency = RegisterSet1[4];
dev3_CurrentPhaseA = RegisterSet1[5];
dev3_CurrentNeutral = RegisterSet1[6];
dev3_CurrentGround = Registers[7];

//device 5
dev5_Frequency = RegisterSet2[4];


method two XMLHttpRequest:

• Part of the HTML DOM (Document Object Model), which is a World Wide Web Consortium (W3C) standard
• Request to read data is made after the page is loaded
• Data can be updated without reloading the webpage
• More difficult to implement than PL Tags

Example using XMLHttpRequest for two meters
function getData() {
         //device at unit ID 25 and 23 are concatenated in postString
         postString = "PL_" + "_25" + "^3209,3210,3211,3208,1180,1100,1103,1104" + "__PL," +
                            "PL_" + "_23" + "^1180" + "__PL";
         doRead(xmlhttp, updateData, postString);   
}

function updateData(Registers) {
         // Assign Scale Factors
         dev25_ScaleFactorA = Registers[0];  // Current Scale Factor
         dev25_ScaleFactorB = Registers[1];  // Neutral Current Scale Factor
         dev25_ScaleFactorC = Registers[2];  // Ground Current Scale Factor

         // Assign Nominal Frequency
         dev25_NominalFrequency = Registers[3];

         // Assign Data Values
         dev25_Frequency         = Registers[4];
         dev25_CurrentPhaseA  = Registers[5];
         dev25_CurrentNeutral   = Registers[6];
         dev25_CurrentGround   = Registers[7];
        
         //device 23 continues with Register[8] being the first register in the array for this second device
         dev23_Frequency   = Registers[8];

...//code continues
}


For more details view the PowerLogic Ethernet Gateway EGX300 reference guide 63230-319-230A1
Also, attached are two example files for the methods mentioned in this article.