The capsule you create for this exercise is a servlet. It has the job of talking to an EJB that takes an account number and retrieves a bank balance from an HSQL database.Ý You will build two HTML documents to achieve this.Ý The first prompts a user for an account number. The second displays the balance, or an error message if an account with the given account number does not exist.
Capsulein the outline and rename it MySimpleBank.
The first element that the MySimpleBank servlet needs is an HTML document with an area to capture an account number input by a user.Ý When the user first goes to the page, the servlet should provide a form in which to enter the account number and a button to submit the account number to the server.
When your servlet receives a GET request from a browser, it should respond by sending the InputPage back to the browser.Ý Even though you are not finished building the page yet, you can go ahead and add the behavior that responds to a browser's GET request.Ý ServletGet is preconfigured to send messages to its actor, so make it a child of InputPage.
Next, you need to create the body of the InputPage. When an HTML actor is inserted as a child of another HTML element, it is nested in that element. For instance, if your capsule contains an HTMLFontStyle actor and you add an HTMLText to it as a child; the HTMLText takes on the font defined by its parent, the HTMLFontStyle. In AppComposer, setting up child HTML elements corresponds to nesting HTML tags, and has the same effects.
You will insert an actor that sets the HTML formatting to the heading style, and then you will add a text actor as a child of the heading, so that the text inherits the formatting.
Since HeadingText is a child of an actor that corresponds to an <H2> HTML tag, the phrase Account Login, which is the value of Heading Text, will be sent to the browser enclosed in <H2> tags, and will display as a second-level heading.
At this point, your capsule outline should look like this:Ý
This is a good time to save your work in the composer/examples directory.Ý Name the capsule MySimpleBank.zac. You can run the capsule at this point by choosing Run from the File menu. The browser should display an HTML page with the text "Account Login".
When the user puts information into the InputPage, you want the page to post the information to the servlet named MySimpleBank. You need to add an HTMLForm to this page that accepts the information from the user and posts it to the servlet.
The user needs to know what to enter on the page, so add some text that will be the prompt for the input field. This text lets the user know what to put into the field next to it.
The form needs a field to capture the account number that the user inputs. The name of the field also represents the name of the parameter that the form will pass to the servlet.
You should also make sure that the field size is an appropriate size to display on the page and that the user cannot enter too many digits for their account number. This can be a first layer of defense in error checking.
You need to set up the servlet so that when the capsule receives the POST request, it looks for a parameter named accountNumber and uses the value associated with that parameter to communicate with the EJB.
So that the user may submit the information entered, you need to add a Submit button as a child of Form.Ý When the user clicks the Submit button, the Form posts the accountNumber the user enters in the AccountInput field to the servlet.
This is what your capsule outline should look like at this point:
Look at the capsule outline. So far it contains actors and behaviors that generate the InputPage HTML file. InputPage has a heading and a form area with a prompt, an input field, and a button that posts the form. The ServletGet behavior allows the servlet to send InputPage to a browser.
After you save your work, go ahead and run the servlet by choosing Run from the File menu. Verify the layout of the input page you just created.Ý
If you click on Get Balance, a blank page appears, since the servlet does not have any instructions yet as to what to do with a POST request.
In the next lesson, you will create a response page that generates and displays the data returned in response to this form page.