Jul/091
VisualWeb JSF: linking form elements to a database (Part I:Displaying)
One of the advantages of using the VisualWeb JSF framework in Netbeans is that it makes the process of storing user data submitted in a web page form easy to store into a database.
The Prep Work
The first thing to do is to ensure your database has been setup with the tables required, and a user that can add data to a table has also been created. This is something I will add in a future post at some point.
As a start point you should have the VisualWeb JSF plugin installed to your copy of Netbeans 6 and created a web application that uses the VisualWeb JSF framework.
Two pages need to created for this application. By default there is a ‘Page1.jsp’ and supporting files created with the application. Add a second page by right clicking on ‘Web Pages’ and choose ‘New -> Visual Web JSF Page’. Label this ‘Page2.jsp’.
Create the form on Page 1 by opening up Page1.jsp. Ensure you are in the Design View for the page. The Woodstock pallette contains the item to use. A full rundown of all the components is available here – we are going to use the input text field and a submit button.
Part I
The first fun thing to do would be to populate an element from your database.
- In the Services Tab, ensure the database you have chosen is connected.
- Drag a listbox over from the Woodstock Basic Panel across to the page. By default it will be filled with ‘Item 1, Item 2 and Item3′, which we want to change to something from a database.
- Give it a label in the Appearance section of the Properties window.
- In the Services tab, go to the table whose data you want to be included in the list box.
- Drag this table into the page.
- Right click on the ListBox Item and right click on it. Choose ‘Bind To Data’ from the menu that appears.
- In the ‘Bind To Data Provider’.
- Choose the table and column you wish to display in the table.
- Now when you deploy and run the application in your browser the information should appear in the table