<composite:interface>
    <composite:attribute name="id" required="false" />
    <composite:attribute name="forward" required="false"
        default="execute-ajax" />
    <composite:attribute name="render" required="false"
        default="UsersTable" />
</composite:interface>

<composite:implementation>
<h:form>
    <rich:graphValidator value="#{passwordValidationBean}" id="gv">
        <rich:panel header="Create User" style="width:500px">

            <rich:messages for="gv" />
            <rich:messages globalOnly="true" />
            <h:inputHidden id="forwardPageId" value="#{cc.attrs.forward}"
                binding="#{users.forwardPage}"
                rendered="#{cc.attrs.forward != 'execute-ajax' }" />
            <h:panelGrid columns="3">

                <h:outputText value="Name:" />
                <h:inputText id="userFullName" value="#{users.fullName}" />
                <rich:message for="userFullName" />

                <h:outputText value="E-mail:" />
                <h:inputText id="userEmail" value="#{users.email}" />
                <rich:message for="userEmail" />

                <h:outputText value="Username:" />
                <h:inputText id="userUsername" value="#{users.username}" />
                <rich:message for="userUsername" />

                <h:outputText value="Password:" />
                <h:inputSecret id="userPassword" value="#{users.password}" />
                <rich:message for="userPassword" />


            </h:panelGrid>
            #{rich:clientId('UsersTable')} 6
            <a4j:commandButton value="Submit Ajax"
                action="#{users.executeCreateUser()}"
                rendered="#{cc.attrs.forward == 'execute-ajax' }"
                render="UsersTable" />
            <h:commandButton value="Submit" action="#{users.executeCreateUser()}"
                rendered="#{cc.attrs.forward != 'execute-ajax' }" />
            <rich:notifyMessages stayTime="2000" nonblocking="true" />
            <a4j:status>
                <f:facet name="start">
                    <h:outputText value="Creating user..." />
                </f:facet>
            </a4j:status>

        </rich:panel>
        </rich:graphValidator>
        <a4j:outputPanel id="UsersTable" ajaxRendered="true" layout="block">
            <h:outputText value="Hello #{users.username} !"
                    styleClass="outhello" />
             <rich:extendedDataTable  id="usersDataTable" value="#{users.usersList}" var="user" frozenColumns="2"
            iterationStatusVar="it" >
                <f:facet name="header">
                    <h:outputText value="Users registered" />
                </f:facet>
                <rich:column>
                    <f:facet name="header">
                        <h:outputText value="#" />
                    </f:facet>
                    <h:outputText value="#{it.index}" />
                </rich:column>

                <rich:column>
                    <f:facet name="header">
                        <h:outputText value="Username" />
                    </f:facet>
                    <h:outputText value="#{user.username}" />
                </rich:column>

                <rich:column>
                    <f:facet name="header">
                        <h:outputText value="Full Name" />
                    </f:facet>
                    <h:outputText value="#{user.fullName}" />
                </rich:column>

                <rich:column>
                    <f:facet name="header">
                        <h:outputText value="Email" />
                    </f:facet>
                    <h:outputText value="#{user.email}" />
                </rich:column>

                <rich:column>
                    <f:facet name="header">
                        <h:outputText value="Status" />
                    </f:facet>
                    <h:outputText value="#{user.activeStatus}" />
                </rich:column>

                <rich:column>
                    <f:facet name="header">
                        <h:outputText value="Description" />
                    </f:facet>
                    <h:outputText value="#{user.description}" />
                </rich:column>
            </rich:extendedDataTable>
        </a4j:outputPanel>

</h:form>
</composite:implementation>