java - 处理数据表中的编辑操作

Question

我有一个带有 3 个输入字段和两个命令按钮（提交和取消）的表单。用户提交表单后，信息应填充到下面的数据表中，包含 3 列。还有一个操作列，其中包含插入的每一行的 EDIT 和 DELETE 命令链接。单击编辑时，需要将该记录的信息填充到上面的表单中，然后如果表单已提交，请检查该记录是否已存在。如果记录不存在，则将其添加到列表中。

XHTML1 名字：

                    <h:outputLabel>LastName:</h:outputLabel>
                    <h:inputText id="lastName" value="#{form.lastName}"/>

                    <h:outputLabel>MiddleName:</h:outputLabel>
                    <h:inputText id="middleName" value="#{form.middleName}" />

                    <h:commandButton value="Cancel" action="#{formBacking.cancel}" immediate="true"></h:commandButton>
                    <h:commandButton value="Submit" action="#{formBacking.submit}"></h:commandButton>

                </h:panelGrid>

            </h:form>

XHTML2

用户详情

            <h:column>
                <f:facet name="header">FirstName</f:facet>
                <h:outputText value="#{userDetails.fname}" />
            </h:column>

            <h:column>
                <f:facet name="header">LastName</f:facet>
                <h:outputText value="#{userDetails.lname}" />
            </h:column>

            <h:column>
                <f:facet name="header">MiddleName</f:facet>
                <h:outputText value="#{userDetails.mName}" />
            </h:column>

            <h:column>
                <f:facet name="header">Action</f:facet>
                <h:commandLink
                    action="#{formBacking.editUser(userDetails)}"
                    value="Edit" />
                <h:commandLink
                    action="#{formBacking.deleteUser(userDetails)}"
                    value="Delete" />
            </h:column>

        </h:dataTable>
    </h:form>

 Form.java
    @Managed Bean
    @ViewScoped
    private String firstName = "";
    private String lastName = "";
    private String middleName = "";
    //Setters and getters

    UserBacking.java

    @ManagedBean
    @ViewScoped

    private List<Form> userList = new ArrayList<Form>();
    \\setters and getters

    public void submit(){}
    public void cancel(){}
    public void editUser(){}
    public void deleteUser(){}

What would be the best way to handle the edit functionality?

Answer 1

You can use rich:modalpanel for action of edit and delete. I guess You knows about that.
It will show you a popup which also has an actionListener method, by using that action listener method you can configure your checks like record exists or not.

Answer 2

使用会话范围的托管 bean。

第一次在数据表中显示用户列表。使您的用户名字字段成为命令链接，以便在单击它时显示我们呈现的相应用户详细信息页面，在此页面中您可以添加您的 CRUD（编辑、删除...功能）。

<p:dataTable border="1" value="#{gestionUtilisateurMB.usersList}" 
                     var="userObj"
                     paginator="true" rows="10"  
                     paginatorTemplate="{CurrentPageReport}  {FirstPageLink}      
    {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink}   
      {RowsPerPageDropdown}"  
                     rowsPerPageTemplate="5,10,15"
                     rowIndexVar="rowIndex"
                      binding="#{table}">
                        <p:column id="column1">
                            <f:facet name="header">
                                <h:outputText 
        value="Login"></h:outputText>
                            </f:facet>


                              <h:commandLink action="#
      {gestionUtilisateurMB.showUserDetails}" value="#{userObj.name}">  
                                 <f:setPropertyActionListener 
       target="#{gestionUtilisateurMB.selectedUserRow}" value="#{userObj}" />
                                 <f:setPropertyActionListener target="# 
         {gestionUtilisateurMB.selectedUserRow.dbRowIndex}" value="#{table.rowIndex}"/>

                              </h:commandLink>  

                        </p:column>
                        <p:column id="column2">
                            <f:facet name="header">
                                <h:outputText 
            value="Name"></h:outputText>
                            </f:facet>
                            <h:outputText value="#
            {userObj.lastName}"></h:outputText>
                        </p:column>

                         <p:column id="column3">
                            <f:facet name="header">
                                <h:outputText id="text3" 
            value="First Name"></h:outputText>
                            </f:facet>
                            <h:outputText value="#
              {userObj.firstName}"></h:outputText>
                         </p:column>

                          <p:column id="column4">
                              <f:facet name="header">
                         <f:facet name="footer">  
                          </f:facet> 

                </p:dataTable>

用户详情：

 <h:panelGrid id="display" header="User Detail" columns="2" cellpadding="4">  

                           <f:facet name="header">  
                              <p:graphicImage value="/src/main/resources/images/users
   /user.png"/>  
                           </f:facet>   
                            <h:outputText value="rowIndex:" />  
                            <h:outputText value="#
        {gestionUtilisateurMB.selectedUserRow.dbRowIndex}" /> 

                            <h:outputText value="Login:" />  
                            <h:outputText value="#
        {gestionUtilisateurMB.selectedUserRow.name}" />  

                            <h:outputText value="Name:" />  
                            <h:outputText value="#
          {gestionUtilisateurMB.selectedUserRow.lastName}" />  

                            <h:outputText value="First Name:" />  
                            <h:outputText value="#
             {gestionUtilisateurMB.selectedUserRow.firstName}" />  

                            <h:outputText value="Email:" />  
                            <h:outputText value="#
            {gestionUtilisateurMB.selectedUserRow.email}" />  

                            <h:outputText value="Phone:" />  
                            <h:outputText value="#
                  {gestionUtilisateurMB.selectedUserRow.phoneNumber}" />  
                     </h:panelGrid>