Agregar el componente al list.xhtml

Queremos usar dos autocomplete para hacer el filtrado de los datos por cedula y por nombre, agregaremos un botón para mostrar todos los documentos.

   <b:panelGrid colSpans="1,4,1,6"  columns="4" size="xs"> 



                    <p:outputLabel value="Cedula"/>
                    <e:autocompletepersona listener="#{personaController.handleAutocompleteOfListXhtml}"
                                                  value="#{personaController.personaSelected}"
                                                  itemLabel=" #{p.cedula}"
                                                  field="cedula"
                                                  update=" :form:datatable"/>

                    <p:outputLabel value="Nombre"/>
                      <e:autocompletepersona listener="#{personaController.handleAutocompleteOfListXhtml}"
                                                value="#{personaController.personaSelected}"
                                                itemLabel=" #{p.nombre}"
                                                field="nombre"
                                                update=" :form:datatable"/>                                                             

                </b:panelGrid>

En el datatable

 <p:dataTable value="#{personaController.personaList}"
                             var="item"
                             id="datatable"
                             >
                    <f:facet name="header">
                        <p:commandButton value="Todos" action="#{personaController.showAll()}"
                                         update=":form:datatable"/>
                    </f:facet>

list.xhtml

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui" 
      xmlns:b="http://bootsfaces.net/ui" xmlns:e="http://xmlns.jcp.org/jsf/composite/extensions">

    <f:view contentType="text/html">
        <h:head>
            <f:facet name="first">
                <meta content='text/html; charset=UTF-8' http-equiv="Content-Type"/>
                <title>PrimeFaces</title>
            </f:facet>
        </h:head>

        <h:body>


            <h:form  id="form" prependId="true">
                
                <b:panelGrid colSpans="1,4,1,6"  columns="4" size="xs"> 



                    <p:outputLabel value="Cedula"/>
                    <e:autocompletepersona listener="#{personaController.handleAutocompleteOfListXhtml}"
                                                  value="#{personaController.personaSelected}"
                                                  itemLabel=" #{p.cedula}"
                                                  field="cedula"
                                                  update=" :form:datatable"/>

                    <p:outputLabel value="Nombre"/>
                      <e:autocompletepersona listener="#{personaController.handleAutocompleteOfListXhtml}"
                                                value="#{personaController.personaSelected}"
                                                itemLabel=" #{p.nombre}"
                                                field="nombre"
                                                update=" :form:datatable"/>
                  
                      
                      

                </b:panelGrid>
                
                <p:messages  id="msg"/>
                <p:dataTable value="#{personaController.personaList}"
                             var="item"
                             id="datatable"
                             >
                    <f:facet name="header">
                        <p:commandButton value="Todos" action="#{personaController.showAll()}"
                                         update=":form:datatable"/>
                    </f:facet>
                    <p:column headerText="Cedula">
                        <p:outputLabel value="#{item.cedula}"/>
                    </p:column>
                    <p:column headerText="Nombre">
                        <p:outputLabel value="#{item.nombre}"/>
                    </p:column>
                    <p:column headerText="Edad">
                        <p:outputLabel value="#{item.edad}"/>
                    </p:column>
                    <p:column>
                         <p:column>

                    <b:commandButton                 
                        style="margin-bottom:10px;"
                        iconAwesome="fa-edit" 
                                         title="Editar"
                        immediate="true"
                        look="primary"
                        action= "#{personaController.prepareView}" 
                        >

                      
                    </b:commandButton>
                </p:column>
                    </p:column>
                    <p:column>
                        <p:commandButton                                             
                            icon="fa-trash-o" 
                            value="Eliminar" 
                            process=":form:datatable" 
                            action="#{personaController.delete(item,false)}" 
                            update=":form:datatable, :form:msg" > 

                        </p:commandButton>
                    </p:column>
                    <p:column>
                        <p:commandButton                                             
                            icon="fa-trash-o" 
                            value="Editar" 
                            process=":form:datatable" 
                            action="#{personaController.prepare(item)}" 
                            update=":form:datatable, :form:msg" > 

                        </p:commandButton>
                    </p:column>
                    
                  
                </p:dataTable>

                <p:commandLink value="new" action="new"/>
                <br></br>
                <p:commandLink value="index" action="index"/>
            </h:form>


        </h:body>

    </f:view>
</html>

Last updated

Was this helpful?