12.1. Introduction to Microsoft Script Editor
The last chapter introduced you to the Microsoft Scripting Technologies and briefly showed you the Microsoft Script Editor while creating your initial script routine. The Microsoft Script Editor is very straightforward to use, especially if you have used other Microsoft editors such as Visual Studio or even other Office products. The other Office products use the Visual Basic for Applications programming language and have an editor called the IDE, or independent development editor.
The Microsoft Script Editor (MSE) has fewer features than other similar editors. This makes it less powerful but simpler to use. You can see an example of the editor in Figure 12-1.
Figure 12.1. Figure 12-1
The first two panels displayed are ones that you will use the most when editing scripts in the MSE. The Document Outline panel displays the various events and procedures that you have created code for, and it allows you to move between them. The Main Editing panel, displaying the code in script.js in Figure 12-1, is where the code you will be editing is displayed.
As with other Microsoft editors, the MSE has color formatting for various elements of the languages it supports, including JScript. As you type the commands, you will see the code reflected in different colors, such as comments in green and command statements in blue. As with other limited features, you can change various colors by choosing Tools
Options while in the editor, and then click the Fonts and Colors choice under Environment. You can see the Comments color choice in Figure 12-2.
The best way to introduce the editor is to use it, as you did in the last chapter, with real code. As with other chapters, this one will walk you through the creation of an InfoPath form. This time the chapter takes you through the various steps you would perform if you were creating your own form using scripting. The chapter also takes you through various features of the editor and scripting. To start off, you need to create the form.
Figure 12.2. Figure 12-2
12.1.1.
12.1.1.1. Try It Out: Creating the Initial Form
To show you the features of the editor and scripting, you will create a form that has the user provide his or her first and last name. The form then displays the name in two different formats: LastName, FirstName and Full Name consisting of First Name and Last Name. You can see an example of the completed form in action in Figure 12-3.
Figure 12.3. Figure 12-3
Click Design a Form.
Click New Blank Form under the Design a Form.
Click on the Layout task.
Click on Two-Column Table.
Using the methods described throughout the book, add the labels and four fields as shown in Figure 12-4.
Figure 12.4. Figure 12-4
Name the four fields, as shown in Figure 12-4.
Once you have the form set up as described, you are ready to work with code. In the last chapter, you saw the Load:: function used in conjunction with a form to display a message box. In this chapter, you will use more than just the Load:: function. To prepare you for that, take a look at a few commands available in JScript.