JSON
60
Doc.Id. HMSI-27-212
Anybus CompactCom 40 EtherNet/IP
Doc.Rev. 1.5
7.3 Example
This example shows how to create a web page that fetches Module Name and CPU load from the mod-
ule and presents it on the web page.
The example below is built using the following libraries:
• jQuery JavaScript Library v1.9.1 (http://jquery.com)
• JavaScript Templates 2.2.0 (https://github.com/blueimp/JavaScript-Templates)
The file, containing this code, has to be stored in the built-in file system, see “File System” on page 20,
and the result can be seen in a common browser.
<html>
<head>
<title>Anybus CompactCom</title>
<!-- Imported libs -->
<script type="text/javascript" src="vfs/js/jquery-1.9.1.js"></script>
<script type="text/javascript" src="vfs/js/tmpl.js"></script>
</head>
<body>
<div id="info-content"></div>
<script type="text/x-tmpl" id="tmpl-info">
<b>From info.json</b><br>
Module name:
{%=o.modulename%}<br>
CPU Load:
{%=o.cpuload%}%<br>
</script>
<script type="text/javascript">
$.getJSON( "/module/info.json", null, function(data){
$("#info-content").html( tmpl("tmpl-info", data ) );
});
</script>
</body>
</html>
