Skip to Content
Author's profile photo Peter Spielvogel

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:

  1. jumping to a different transaction and bringing the values back to the original screen
  2. 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.

/wp-content/uploads/2014/10/twitter_563202.png 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.

/wp-content/uploads/2014/10/p3script1a_563195.png

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.

/wp-content/uploads/2014/10/p3script1b_563196.png

Here is the script.

/wp-content/uploads/2014/10/p3script1c_563197.png

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

  1. session.findById(“wnd[0]/tbar[0]/okcd”).text = “su01”;
  2. 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”}}
  3. session.findById(“wnd[0]/usr/ctxtSUID_ST_BNAME-BNAME”).text = uname;
  4. 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

  1. 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”}}

  1. session.findById(“wnd[0]”).sendVKey(0);
  2. session.findById(“wnd[0]/usr/lblPersonas_5”).text = fname;
  3. 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:

  1. Record my keystrokes performing the transaction to the point of getting to SU01. Stop recording.
  2. Click on the Inspector (right side of scripting window) and select desired field. First one was the first name field.
  3. 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).

/wp-content/uploads/2014/10/p3script1d_563198.png

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:

  1. 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:

  1. session.findById(“wnd[0]/usr/lblPersonas_6”).text = “lastname”;

End:

  1. 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:

/wp-content/uploads/2014/10/p3script2a_563199.png

End:

/wp-content/uploads/2014/10/p3script2b_563200.png

We skip over this screen entirely (streamlining the process for users):

/wp-content/uploads/2014/10/p3script2c_563201.png

The JavaScript is even simpler than the other example and introduces no new syntax.

  1. Record your keystrokes.
  2. Copy the user name from the screen: use inspector to select text, then create variable as described above.
  3. 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

  1. session.findById(“wnd[0]/tbar[0]/okcd”).text = “su01”;

// press enter

  1. 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

  1. session.findById(“wnd[0]/usr/ctxtSUID_ST_BNAME-BNAME”).text = user;

// press “glasses” button to lookup user

  1. 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.

Assigned Tags

      6 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Former Member
      Former Member

      Thanks a lot, Peter

      Bala Suresh

      Author's profile photo Daniel Ruiz
      Daniel Ruiz

      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.

      Author's profile photo Peter Spielvogel
      Peter Spielvogel
      Blog Post Author

      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

      Author's profile photo Daniel Ruiz
      Daniel Ruiz

      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.

      Author's profile photo Peter Spielvogel
      Peter Spielvogel
      Blog Post Author

      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

      Author's profile photo Daniel Ruiz
      Daniel Ruiz

      hi Peter,

      will ask the Basis people to do it, thanks for your help.

      D.