Typical uses might include:

• Enhancing the edits provided by Lawson (i.e. if you have additional business logic/edits you want to add, JavaScript might be the right answer). Be mindful of the fact that you can really only enforce additional edits; Design Studio cannot be used to or override the edits built into the back-end Lawson application forms.
• Updating other Lawson forms via an AGS call; for example, when setting up a new customer using AR09, why not use Design Studio to populate AR10?
• Displaying information from other sources (e.g. other web sites, other Lawson forms/tables, etc.) on a Lawson form. In other words, create your own Lawson mashup!
• Lightweight integration/updating external systems (e.g. after hiring an employee, add the new employee to your helpdesk system)
• Setting form values based on other values entered by the user (e.g. if Company 4321 and Process Level 101, then the activity is probably XYZ)

Here are my keys to understanding objects:

• Objects are grouped hierarchically and inherit from their parents.
• Objects have properties (i.e. variables or settings)
• Objects support their own methods (i.e. functions/subroutines)
• Objects invoke the methods of other objects (i.e. clicking one button fills a text box)
• Objects respond to events (i.e. “I’m a button and someone clicked me!”)

There are tons of books and resources on the web for learning JavaScript and various aspects of programming against the DOMs; here are a few:

http://www.webmonkey.com/webmonkey/programming/javascript/tutorials/tutorial1.html
http://www.webreference.com/programming/javascript/definitive/
http://www.w3.org/DOM/
http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dom/domoverview.asp

I also recommend looking at Lisa Wollin's excellent blog tutorials about Javascript and the object models:

http://blogs.msdn.com/lisawoll/archive/2005/03/16/396878.aspx
http://blogs.msdn.com/lisawoll/archive/2005/04/05/405744.aspx

As well as her DOM diagrams:

http://www.wollinweb.com/blogimages/jsdom.gif

How Lawson augments the object model

What Lawson does in Portal—and which you therefore have access to via Design Studio—is to add some objects to the model. Among the various objects which Lawson implements are:

• lawPortalObj: A top-level object, providing access to Lawson Portal-related objects.
• FormObj: An XML representation of a Lawson form, which can be used to interact with the application forms; used for getting/setting screen field values, getting/setting data field values (in the Magic object), positioning the active element and retrieving phrases.
• DataStorage: An object which abstracts out the differences between Internet Explorer and Navigator, encapsulating these vendor-specific differences.
• Magic: A  transaction object with methods for accessing data elements as well as performing a transaction and validate results.
• FormState: Used to maintain properties of the state of the application form; commonly used to retrieve the currentRow state when working with detail area elements.

Since it helps to see this graphically, here's a diagram I started on a while back, intending to incorporate all of the Lawson objects into a comprehensive object diagram:

Let’s explore a little bit...

Now that we’ve covered some of the foundations of JavaScript and how Lawson adds to the object model, you might want to explore a little of this within the context of Lawson Portal. One way to do it is to install a browser add-on that displays the Javascript information for each element on the page. I use Firefox and a free Web Developer toolbar (http://chrispederick.com/work/webdeveloper/). I can then click on a given page element and see more about the JavaScript/DOM properties (i.e. where the object is in the object hierarchy [e.g. parent/children], etc.):



Coding your JavaScript in Design Studio

The primary way in which you use JavaScript in Design Studio is to write small chunks of code which “hook” the desired events for various objects, i.e. a button’s OnClick(), a Form’s OnBeforeTransaction(), etc.

When you’re in Design Studio, click on the ‘Script’ link in the View Selection:

This opens up the scripting window for your form.  Next, select the object and desired event that you want to hook. In this example, I want to write some code that is triggered after the invoice is entered, but before the passing the transaction back to the Lawson application. To do this, I capture the Form’s OnBeforeTransaction() event, and enter my additional validations/edits:

This is but one example of how you can use JavaScript in Lawson Design Studio to enhance your Lawson forms. As with previous articles in this series, I can only show you a few highlights—enough to whet your appetite and imagination. There’s an awful lot you can do. If you want to get more detail, read the documentation and consider some training.

And, please, before you start going too wild with Design Studio customizations, go back a re-read my first article in this series (see https://www.danalytics.com/guru/letter/archive/2006-12.htm).  You are making a conscious decision before using Design Studio to customize a form. Yes, you are streamlining the application, but you’re also adding a level of complexity to the system--as well as to your support infrastructure--and Lawson's support as well. And, the logic you’re coding in Design Studio is only applied when the user interacts with the form via Design Studio. If the form is accessed via ProcessFlow AGS, Excel Add-Ins, etc., the logic WILL NOT be performed. If it’s your intention to enforce or add new business rules, I would ALWAYS recommend coding them in COBOL user exits.

Including common JavaScript routines into Multiple Forms

As you increasingly use JavaScript in Design Studio, you’ll notice that you’re repeating the same or similar code for various functions, and pasting them into multiple forms. For example, you’ll probably find that you end up with various routines that get used across multiple forms, performing functions such as:

• AGS, DME Calls
• Common Lookups
• Date logic
• String functions

There’s no need to keep copying/pasting the same code into each form. You can use a Design Studio feature for including the common JavaScript code into multiple forms. Think of it as a “poor man’s repository”.

What you do is save all of your common Javascript routines (debugged and tested of course!) into one or more .js files into a specific folder on the web server:

/lawson/portal/content/scripts

Then, when you need to include a routine that is stored in one of those files, you specify an “include” file, to referenced by your form-specific JavaScript:

Until next time...

In the next article in this series, David Williams (from Paradigm ERP) will share a case study that combines the concepts we have been looking at over the several months into a true solution for one of Paradigm’s clients.

- QUOTE OF THE ISSUE –

“If builders built houses the way programmers built programs,
the first woodpecker to come along would destroy civilization.”
-- Gerald Weinberg