We will be adding another page to the Client Management application which you created in the Client Quick Add lesson. This page will display a grid of clients, a search panel, and an add window.
Step 1 - Create a Simple New Client Page
- Click on Presentation and then Pages.
- Click New Page
- From Categories, select General and from Templates select Blank; name the page New Client; click Save.
- On save you will be redirected to the detail page of the New Client page, from here launch the Page Builder by clicking on Page Builder
- In the Sections tab in the Page Builder, make sure pnMain is selected
- Find Layout in Properties and delete fit and leave it blank.
- You will now add elements to to pnMain
- Add a panel called pnGeneralInfo, title General Information; set its height to 180, its padding to 20 and its border to false
- To pnGeneralInfo add a panel called pnTopColumns and set its layout to column, its border to false, and its height to 60
- Add two FormPanels to pnTopColumns, one called pnRight1 and one called pnLeft1, and set their ColumnWidths each to .5, and their borders to false
- Distribute 4 TextFields among the 2 column panels: First Name, Last Name, Email, and Mobile Phone
- To the bottom of pnClientDetails also add a TextArea called txtMailingAddress, FieldLabel Mailing Address, width 640
- To pnGeneralInfo add a panel called pnTopColumns and set its layout to column, its border to false, and its height to 60
- Create a similar panel for Department Information for the following final result:
- Add a panel called pnGeneralInfo, title General Information; set its height to 180, its padding to 20 and its border to false
- Find the Data Source tab
- Click the Add button and Add a Unified Store
- Set its ID to storeClients and click Create
- Make sure storeClients is selected and in the Properties panel at the right of the screen, click on Settings
- Set Data Source Type to Business Objects
- Set Data Source to Client
- Check the Create checkbox
- In the Create tab, match all the TextFields to attributes of the Client business object in the Controls Column
- Click on Properties and add clientCreated(); to the Success textarea.
- Click Save
- Click Save in the Configuration window
- Make sure pnMain is selected and click on TopBar in the Properties panel
- Add a button called Save with Icon Accept; click Apply
- In the Listeners tab, select Click and from Fn select PageManager.ruleAction_execute_storeClients_Create
Click on the Source tab and add the following JavaScript to the Head tag
<script language="javascript"> function clientCreated() { parent.newClientPage.close(); } </script>