# Rol

![](https://1858461661-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Lc1Wg6kAgaR6ehL7j4M%2F-LgEDa3ameYGZJZg3Q3Y%2F-LgEFktNb0MgtAeu2NKA%2Flist.png?alt=media\&token=17fa35a7-fdd4-4a1f-8c31-4335addc6b2d)

### Creamos las paginas list.xhtml



### Código completo

```markup
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html>
<ui:composition template="/layout/template.xhtml" 
                xmlns="http://www.w3.org/1999/xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:b="http://bootsfaces.net/ui"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:p="http://primefaces.org/ui"
                xmlns:jmoordbjsf="http://jmoordbjsf.com/taglib"
                xmlns:e="http://xmlns.jcp.org/jsf/composite/extensions">
    <ui:define name="content">


        <style>
            .thumbnail { max-width: 100%; }
            img.thumbnail:hover, img.thumbnail:focus {
                border: 1px solid;
                border-color: #428BCA;
            }
        </style>

        <b:form id="form"  prependId="false"  rendered="#{p:ifGranted('ADMINISTRADOR')}" onkeypress="if (event.keyCode == 13) {
                    return false;
                }">

            <b:growl id="msgs"/>
            <b:panel title="#{msg['titlelist.rol']}" id="content"   look="primary" > 
                <!--<b:panelGrid colSpans="2,10" size="xs">--> 
                <b:panelGrid colSpans="1,4,1,6"  columns="4" size="xs"> 

                    <p:outputLabel value="#{msg['field.idrol']}"/>
                    <jmoordbjsf:autocomplete converter="#{rolConverter}"
                                completeMethod="#{rolController.rolServices.complete}"
                                labeltip1="#{msg['field.idrol']} #{p.idrol}"
                                labeltip2="#{msg['field.rol']} #{p.rol}"
                                listener="#{rolController.handleAutocompleteOfListXhtml}"
                                value="#{rolController.rolSearch}"
                                itemLabel="#{p.idrol}"
                                field="idrol"
                                update=":form:dataTable"/>

                    <p:outputLabel value="#{msg['field.rol']}"/>
                    <jmoordbjsf:autocomplete converter="#{rolConverter}"
                                completeMethod="#{rolController.rolServices.complete}"
                                labeltip1="#{msg['field.idrol']} #{p.idrol}"
                                 labeltip2="#{msg['field.rol']} #{p.rol}" 
                                 listener="#{rolController.handleAutocompleteOfListXhtml}"
                                 value="#{rolController.rolSearch}"
                                 itemLabel=" #{p.rol}"
                                 field="rol"
                                 update=":form:dataTable"/>

                </b:panelGrid>

                <b:row>
                    <b:column medium-screen="4">
                        <jmoordbjsf:search label="#{msg['field.activo']}"
                                           value="#{rolController.rolSearch.activo}"
                                           renderedList="#{p:ifGranted('ADMINISTRADOR')}"  
                                           search="#{rolController.searchBy('activo',rolController.rolSearch.activo)}"
                                           />
                    </b:column>
                </b:row>
            </b:panel>
            <b:panel id="dataTable" look="primary">
                <jmoordbjsf:paginator
                    controller="#{rolController}"                        
                    rowPage="#{rolController.rowPage}"                   
                    page="#{rolController.page}"
                    pages="#{rolController.pages}"
                    skip="ajax:rolController.skip()" 
                    url = "/pages/rol/new.xhtml"
                    />
                <b:dataTable value="#{rolController.rolDataModel}"
                             var="item"
                             id="dataTable2"
                             paginated="false"
                             onpage="console.log('page');">

                    <b:dataTableColumn value="#{item.idrol}" label="#{msg['field.idrol']}"/>
                    <b:dataTableColumn value="#{item.rol}" label="#{msg['field.rol']}" />
                    <b:dataTableColumn value="#{item.activo}" label="#{msg['field.activo']}" />

                    <b:dataTableColumn label="">

                        <jmoordbjsf:column

                            renderedEdit="#{p:ifGranted('ADMINISTRADOR')}"
                            renderedDelete="#{p:ifGranted('ADMINISTRADOR')}"
                            controller="#{rolController}"
                            url="/pages/rol/view.xhtml"
                            item="#{item}"

                            />
                    </b:dataTableColumn>

                </b:dataTable>
            </b:panel>

        </b:form>

        <jmoordbjsf:denegado renderedcondition="#{!p:ifGranted('ADMINISTRADOR')}" />
    </ui:define>
</ui:composition>

```





