Prerequisites
- Products: Liquid UI WS, Liquid UI Server or Local DLL, Client Software
- Commands: set(), del(), pushbutton()
Purpose
This article guides you on how to display values in the input fields automatically from a message. Here, we are considering the SAP Easy Access screen to demonstrate the process and walk you through the following steps:
- Delete the image container on the SAP Easy Access screen
- Add two input fields to display the values
- Add a push button to execute the process
- Add a function to retrieve values from a message
User Interface
//Create the file SAPLSMTR_NAVIGATION.E0100.sjs inside your scripts folder for customizing the SAP Easy Access screen
//Now, let's add the Liquid UI script to the above file and save it
Customization
- Delete the image container on the SAP Easy Access screen using the del command.
// Deletes the image container on the SAP screen del('X[IMAGE_CONTAINER]');
- Add two non-editable input fields labeled Order Number and Deliv. Number to display the values.
//Creates input fields to display the values inputfield([1,1],"Order Number", [1,15], {"name":"z_num0", "size":"15", "readonly":true}); inputfield([2,1],"Deliv. Number", [2,15], {"name":"z_num1", "size":"15", "readonly":true});
- Add a toolbar push button labeled Execute to execute the testFunction process on click.
//Creates a toolbar push button labeled Execute pushbutton([TOOLBAR],'Execute','?',{'process':testFunction});
- Add the testFunction function to retrieve the values from the message and display them in input fields.
//Function to retrieve and display values from the message function testFunction(){ myarr = []; mymsg = 'The order 123021213 is saved and 542321 updated'; // Sample message var res = mymsg.match(/[-+]?[0-9]*\.?[0-9]+/g); myarr = res.toString().split(','); // Store the numbers in an array for(var idx=0;idx<myarr.length;idx++){ set('V[z_num&V[idx]]',myarr[idx]); } }
SAP Process
- Refresh the SAP screen and click the Execute toolbar push button. You will observe the values from the message are displayed in the Order Number and Delv. Number input fields, as shown below.
Next Steps
Translate text to another language
Learn how to translate the text entered in the input field using wscurl.
Learn how to translate the text entered in the input field using wscurl.
10 min.
This article is part of the Take a deep dive into the input field and pushbutton tutorial.