My first script in SAP Screen Personas 3.0 – a JavaScript primer
As part of the product team, I shared the excitement of the developers around a new, more powerful scripting engine in SAP Screen Personas 3.0 that is based on JavaScript. Like many of you who have no experience with JavaScript, I was a bit intimidated, especially by the { and } symbols, which look like serious programming. I’m pleased to report that I wrote my first (and second) script in SAP Screen Personas 3.0 – and it was much easier than I thought.
For basic scripts, I see customers doing two main things:
- jumping to a different transaction and bringing the values back to the original screen
- copying information from one screen and pasting it on another
The only JavaScript you need for these steps is:
- Defining variables using the statement: “var yourvariablename = “; then removing the stored value from the end of the line.
- Removing the hardcoded values captured during the screen recording process and replacing them with your variable names.
Using JavaScript in SAP Screen Personas 3.0 does not need to be intimidating.
If you want to know how to apply this in your scripts, keep reading. In this post, I will share with you the basic steps and JavaScript syntax you will need to move information between screens.
I built my script on the SMEN transaction, connecting it to SU01 for user information. I removed the user area and added several custom fields. Here is what it looks like.
Script Example #1 jumping to a different transaction and bringing the values back to the original screen
Each script button contains a single script. First, let’s examine the “Lookup” button. I type my user name “peter” into the text box, click the “Lookup” button, and my full name appears in the space that formerly contained firstname and lastname.
Here is the script.
Full text of the script copied from the script window for readability (includes my comments).
// copy name from text box; assign to variable “uname”
var uname = session.findById(“wnd[0]/usr/txtPersonas_3”).text;
// enter SU01 into OKcode field, type enter, paste name on SU01, click lookup button
- session.findById(“wnd[0]/tbar[0]/okcd”).text = “su01”;
- session.findById(“wnd[0]”).sendVKey(0);// {“eventName”:”Change”,”tcode”:”SU01″,”screen”:”1050″,”controlCustomData”:{“SID”:”wnd[0]/usr/ctxtSUID_ST_BNAME-BNAME”,”Type”:”GuiTextField”,”focusable”:”X”},”eventParas”:{“Id”:”__AGIM0:U:::0:11″,”Value”:”PETERPETER”}}
- session.findById(“wnd[0]/usr/ctxtSUID_ST_BNAME-BNAME”).text = uname;
- session.findById(“wnd[0]/tbar[1]/btn[7]”).press();
// define variables for first name and last name
var fname = session.findById(“wnd[0]/usr/tabsTABSTRIP1/tabpADDR/ssubMAINAREA:SAPLSUID_MAINTENANCE:1900/txtSUID_ST_NODE_PERSON_NAME-NAME_FIRST”).text;
var lname = session.findById(“wnd[0]/usr/tabsTABSTRIP1/tabpADDR/ssubMAINAREA:SAPLSUID_MAINTENANCE:1900/txtSUID_ST_NODE_PERSON_NAME-NAME_LAST”).text;
// return to SMEN transaction
- session.findById(“wnd[0]/tbar[0]/okcd”).text = “/n”;
// {“eventName”:”Enter”,”tcode”:”SU01″,”screen”:”1100″,”controlCustomData”:{“SID”:”wnd[0]/tbar[0]/okcd”,”Type”:”GuiTextField”},”eventParas”:{“Id”:”ToolbarOkCode”}}
- session.findById(“wnd[0]”).sendVKey(0);
- session.findById(“wnd[0]/usr/lblPersonas_5”).text = fname;
- session.findById(“wnd[0]/usr/lblPersonas_6”).text = lname;
Most of this JavaScript code (not the comments) was auto generated by SAP Screen Personas.
Here is what I did:
- Record my keystrokes performing the transaction to the point of getting to SU01. Stop recording.
- Click on the Inspector (right side of scripting window) and select desired field. First one was the first name field.
- Scroll down to the text and click it to add this content to the script (which is no longer recording, but you can manually add steps).
Do the same for the last name field (not pictured).
JavaScript that you need to learn:
Define a variable for each of these values to replace the fixed text.
Simply add “Var yourvariablename = “ to the beginning of the line (blue text).
Remove the stored value from the end of the line (red text).
Start:
- session.findById(“wnd[0]/usr/tabsTABSTRIP1/tabpADDR/ssubMAINAREA:SAPLSUID_MAINTENANCE:1900/txtSUID_ST_NODE_PERSON_NAME-NAME_LAST”).text = “STEINHAUERS”;
End:
var lname = session.findById(“wnd[0]/usr/tabsTABSTRIP1/tabpADDR/ssubMAINAREA:SAPLSUID_MAINTENANCE:1900/txtSUID_ST_NODE_PERSON_NAME-NAME_LAST”).text;
Then, continue recording and return to your SMEN transaction.
Pause recording and use the Inspector to add the custom text fields that will receive your pasted values to your script.
JavaScript #2 that you need to learn:
Replace the fixed text value with your variable name.
Start:
- session.findById(“wnd[0]/usr/lblPersonas_6”).text = “lastname”;
End:
- session.findById(“wnd[0]/usr/lblPersonas_6”).text = lname;
You have replaced the initial value in the text field (red text) with the variable name (blue text). Please note that the quotation marks around the original text are gone when you replace it with the variable name.
That’s it for the first scripting example. Two easy changes to the text. And, no messy curly braces {}.
Script Example #2 copying information from one screen and pasting it on another
This script takes the name from the custom input field and then goes directly to the information tabs in SU01, bypassing the initial screen in which you generally enter the user name and click the glasses to look up information (thereby saving keystrokes).
Start:
End:
We skip over this screen entirely (streamlining the process for users):
The JavaScript is even simpler than the other example and introduces no new syntax.
- Record your keystrokes.
- Copy the user name from the screen: use inspector to select text, then create variable as described above.
- Replace user name with variable name.
Here is the text of the script:
// copy user name from screen
var user = session.findById(“wnd[0]/usr/txtPersonas_3”).text;
// enter SU01 into OKcode field
- session.findById(“wnd[0]/tbar[0]/okcd”).text = “su01”;
// press enter
- session.findById(“wnd[0]”).sendVKey(0);// {“eventName”:”ListAccess”,”tcode”:”SU01″,”screen”:”1050″,”controlCustomData”:{“SID”:”wnd[0]/usr/ctxtSUID_ST_BNAME-BNAME”,”Type”:”GuiTextField”,”focusable”:”X”},”eventParas”:{“Id”:”__AGIM0:U:::0:11″,”ItemListBoxId”:”SUGGEST_TALB”,”FilterValue”:”s”}}
// “paste” user name captured from original screen
- session.findById(“wnd[0]/usr/ctxtSUID_ST_BNAME-BNAME”).text = user;
// press “glasses” button to lookup user
- session.findById(“wnd[0]/tbar[1]/btn[7]”).press();
So, the essential JavaScript code you need to know for both of these use cases is:
“var yourvariablename = “
Also removing hardcoded values and replacing them with your variable names.
In a future post, I’ll explore the IF statement and how to use it.
For the SAP Screen Personas product team, Peter Spielvogel.
Thanks a lot, Peter
Bala Suresh
hi Peter,
cool.. tried this code you posted, but no luck!
trying to modify (and read afterwards) any input value on the screen gives me an error while trying to maintain the state (personas/state/json) - error -101 [failed to set value]
renders me unable to use personas in fact, since I cannot read the new custom fields to inject into the transaction fields while in a script..
have you come across this issue? - any help you could provide me would be awesome..
Cheers,
D.
Hi Daniel,
Did you modify the script to use the field names that appear on your screen?
Click on each field with the "inspector" in script mode to obtain the field name. For SAP fields, these will match. For text fields and other items you added to your screen, these may be different. From your error description, they probably are. Then, you can manually edit your script to ensure it is pointing to the correct field names that appear on your specific screen.
Regards,
Peter
yep,
I can access the values and even alert on them (shows correctly) but it always ends up in a script error (Console, Chrome) and even thou the xhr is OK (200) we end up with this error from the back-end.. - which will trigger an error in Personas 3 and restart the whole window.
pretty much no scripts can be used.. which defeats the purpose.. looking everywhere for a solution, all notes applied but cant get it to work.
even if the script is totally blank, if we enter anything on a inputfield (for instance, 12 or abc) and press 'execute script' (which has nothing) it will still result in an error on personas side.
maybe one of your mates over there may have seem this before.. (all system checks are green, all notes up to today applied, system on latest kernel / sp too..)
Cheers,
D.
Hi Daniel,
Please open an OSS Message so we can see exactly what is happening on your system. You can email me or private message me through SCN when you have the ticket number.
Thanks and regards,
Peter
hi Peter,
will ask the Basis people to do it, thanks for your help.
D.