Using a Resource Bundle File for the Pages

You will use a resource bundle file for labels, texts and messages.

To use a resource bundle file:

1. Return to the Design view, then click the JSF Core library in the Palette to add a loadBundle component. Drag the tag next to the f:view tag, as shown in Figure: Design View.

   Design View

   
   

2. In the New Load Bundle dialog click the Bind a dynamic value button next to the Base name field.

   Locate the src | Resources | application file, as show in Figure: Resource Bundle Selection Dialog.

   Resource Bundle Selection Dialog

   
   

   Click OK.

3. In the Variable name field enter bundle, as shown in Figure: New Load Bundle Dialog.

   New Load Bundle Dialog

   
   

   Click Finish.

4. Back in the code editor, using the split view, click the loadBundle icon . In the Log View at the bottom, select the Properties tab, as shown in Figure: Properties Tab in Log View. You can review and update the properties of any component using the Properties View.

   Properties Tab in Log View

   
   

5. In the source view of the login.jspx page press the Ctrl key, then hover over resources.application and click the hyperlink, as shown in Figure: Source Code of Login Page.

   Source Code of Login Page

   
   

   The application.properties bundle file opens in the editor displaying the existing messages, as shown in Figure: Application Properties Tab. You can define new key resources directly in the file or create new ones dynamically.

   Application Properties Tab

   
   

6. Back to the login.jspx page, select the af:panelLabelAndMessage tag.

   In the Property View, click the Bind to a dynamic value button next to Label, as shown in Figure: Panel Label and Message.

   Panel Label and Message

   
   

7. The Choose Binding dialog opens with the already defined binding elements (bundle and managed beans), as shown in Figure: Choose Binding Dialog.

   Choose Binding Dialog

   
   

8. Click the Resources tab to display the resources keys, then click the Add button to create a new key entry, as shown in Figure: Resources Tab.

   Resources Tab

   
   

   In the New Resource dialog enter name as the Resource Key and Name: as the Resource Value, as shown in Figure: New Resource Dialog.

   New Resource Dialog

   
   

   Click OK. The new entry appears in the Resources, as shown in Figure: Resources Tab.

   Resources Tab

   
   

9. Click the View arrow and select Resource Values, as shown in Figure: Choose Binding Dialog.

   Choose Binding Dialog

   
   

   Click OK. The application.properties file is now populated with the new value, as shown in Figure: application.properties File.

   application.properties File

   
   

10. Back in the JSPX code, you can see the updated label field for the Panel Label And Message, as shown in Figure: Updated Label Field.

    Updated Label Field

    
    

11. Look at the Outline pane located on the right side. It gives a hierarchy view of the page tags, as shown in Figure: Outline Tab.

    Outline Tab

    
    

12. To experiment in another way to use the resource bundle file, click the application.properties tab to open the editor and add a new entry for password. Type password=Password\:, as shown in Figure: application.properties Tab.

    application.properties Tab

    
    

    Click the Save All button to save your work.

13. Back in the code of the login.jspx page, delete password in the label of the af:panelLabelAndMessage and type #{}. Within the brackets, press Ctrl+Space and select bundle from the suggested list, as shown in Figure: Login Page.

    Login Page

    
    

    Type ',' (comma) and from the JSP proposal popup, select password, as shown in Figure: Login Page.

    Login Page

    
    

14. Now select the Submit button and in the Property View, click the Bind to a dynamic value button next to the Text field, as shown in Figure: Bind to a Dynamic Value Button.

    Bind to a Dynamic Value Button

    
    

15. In the Choose Binding dialog, click the Resources tab, then Click the New Resource button.

    In the New Resource dialog, enter submit as the Resource Key and Login as the Resource Value, as shown in Figure: New Resource Dialog.

    New Resource Dialog

    
    

    Click OK and OK again.

16. Your login page is now complete, as shown in Figure: Login Page.

    Login Page

    
    

17. Click the Save All button to save your work.