WebView
The WebView is an area on a card or a completely separate Anvaigo page of the map type on which web content can be displayed. This can be used to create charts, tables or to display product images from the Internet, for example.
Requirements
To use the WebView, the Anvaigo Client Suite version 11 and the current app versions are required.
Objects
No separate objects are required for the WebView.
Technical details
The WebView is primarily an HTML page for display. When loading an Anvaigo page, data must be transferred to the HTML page, which can then be displayed on it. In our examples we use the JavaScript library Vue.js.
When the Anvaigo page is opened, the data is passed to a JavaScript command and processed there for further display. Therefore the following function is required in the JavaScript file:
function WebViewDataLoaded(name, value) {};In the OnAfterGetRecord of the Anvaigo page, the data and fields are then passed to the WebView using the new page command PAGE(‘SETWEBVIEWDATA’). The basis of the WebView is an Anvaigo action code of type HTML. The associated action code of the type JavaScript is stored as a library in the HTML action code.
The HTML page can also be modified via CSS. For this, an action code of type CSS must be available, which is stored as a library in the HTML action code.
Anvaigo Script commands
Anvaigo Script Command for passing data to the WebView. This is used in the Anvaigo page in the OnAfterGetRecord. Each call executes the JavaScript function: WebViewDataLoaded(name, value) {};. This must therefore always be contained in a JavaScript file.
WebViewDataLoaded(name, value) {};
The JavaScript part of the PAGE(‘SETWEBVIEWDATA'[…]); function. This is always called when the PAGE command is executed. This function processes the transferred data for the display.
PAGE('SETWEBVIEWDATA', String Fieldname, String Variable name, Record / String Value, String Columns);
This function loads data into the WebView
Specifies the field name of the WebView on an Anvaigo page that is updated by the SETWEBVIEWDATA command. Can be empty if the Anvaigo page is of the WebView type.
Value of the first parameter of the WebViewDataLoaded(name, value) function called in the JavaScript action code.
Specifies a filtered and sorted data record. If a record is specified, the last parameter must be filled. Can also be passed as string. This then corresponds to the value of the second parameter of the WebViewDataLoaded(name, value) function, which is called in the JavaScript action code.
If the Record/Value parameter contains a value, a comma-separated string of field numbers must be passed. An object is then automatically generated from this and the data record for transfer to the function. If the string is empty, only the primary key fields are passed.
RunScriptOnRecord(String ActionCode, parameter);
This command executes the specified Anvaigo action code from the JavaScript file. As an example, the transferred data is processed here and the synchronization is triggered. The specified action code must be stored in the HTML action code as a library.
Anv_Debug(String Message);
Debug command to display Debug messages in the device’s runtime log.
Examples
You can find an example in our Sales App. Here, for example, we display the order lines in another tab on the sales order card via the WebView. In the main menu you will find the item Top Customers. A chart diagram is displayed here.
In the Anvaigo Service App, an overview of the articles and times entered opens before a service order is signed. The signature can then be made.