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>

PreviousComponente autocompletepersona NextTaller 15. Paginacion

Last updated 6 years ago

Was this helpful?

<!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>