Adding row edit to a data table
When you add support for row edit to a data table, users can edit specific rows in a data table without having to navigate to another page. The user clicks an Edit button in the row edit column of the data table. A form then appears in which the user enters new text and chooses to save the text or cancel out of the form. This option is especially useful when you have data tables that are display-only tables.
To add the ability to edit rows in a data table:
- Select the data table. The Properties view for the data table opens.
- On the Row actions tab of the Properties view for the data table, click Add next to "Add an edit column that brings up a form for in-place editing of row content." A new row edit column that contains a JSP panel is added to the data table.
- Now you need to create a small form in the new column so that the user can easily edit the row. Here is one way to create that form:
As an alternative, you can build your own form within the panel. For example, you can drag input components to the panel for data that is not on display in the read-only row and bind these controls to the corresponding data fields for the data source you used to create the table.
- Open the Page Data view. Drag the data you used in the read-only part of the table to the panel (jspPanel). Make sure you are dragging to the panel and not to the column. You are prompted to create new controls.
- In the Insert dialog that displays, choose whether to display, update, or create a record.
- Choose the columns that you want to display in the new form. Make sure to change the control type to Input Field for any columns you want to be able to edit in the form.
By default, Save and Cancel buttons appear on the form that displays to the user.
- To have the changes from the form go back to the database:
- Select the Row Edit component in the new column. (If you have difficulty selecting the Row Edit component, go to the Properties view and choose hx:commandExRowEdit). The Row Edit Properties view opens.
- Click the Quick Edit icon to switch to the Quick Edit view and enter the following code in the right pane. Replace "MyList" with the name of your SDO relational list:
try { getMyListMediator().applyChanges((DataObject)((ECoreEList)getMyList()).getEObject()); } catch (Throwable e) { logException(e); }If you are using WDO, enter the following code in the right pane and replace "MyList" with the name of your WDO relational list:try { getMyListMediator().applyChanges(getMyList().getDataGraphAccessBean()); } catch (Throwable e) { logException(e); }Note that these code samples work only for SDO or WDO relational records and record lists.- You can then set navigation rules in the Row Edit Properties view by clicking Add Rule. These rules identify the pages to go to when the action is performed
Related concepts
JavaServer Faces
Data table components
Related tasks
Creating Faces applications - overview
Adding a data table
Using navigation rules with Faces JSP pages
Associating row actions with a data table
Enabling row selection for a data table
Adding row category support to a data table
parameter from one Faces JSP page to another. Several Faces components, such as command buttons or command hyperlinks, can help you do this">Passing parameters with a data table
footer. A header is displayed along the top of the data table and a footer along the bottom of the data table. You can drag other Faces components to the header and footer. For example, if you want a title for the table and an image next to the title, you can drag an Output component and an Image component to the header.">Adding a header and footer to a data table
Passing parameters between JSP files
Related reference
Faces components reference
Faces attributes reference