<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.org/ui"
                template="/WEB-INF/template.xhtml">

    <ui:define name="title">Marques des Véhicules</ui:define>

    <ui:define name="content">
        <h:form>
    <p:panel id="panel" header="Ajouter une marque">

        <p:messages id="msgs" />

        <h:panelGrid columns="7" cellpadding="5">

            <p:outputLabel for="NomMarque" value="Marque" />
            <p:inputText id="NomMarque" value="#{beanMarque.nomMarque}" required="true" label="Nom Marque" >
                <f:validateLength minimum="3" />
            </p:inputText>
            <p:message for="NomMarque" display="icon" />
            <h:outputLabel for="fileIdPhoto" value="Charger la photo:" />
            <p:fileUpload mode="advanced"
              fileLimit="1"
              id="fileIdPhoto"
              allowTypes="/(\.|\/)(gif|jpe?g|png)$/"
              fileUploadListener="#{beanMarque.upload}"/>

            <p:commandButton value="Ajouter" update="panel" actionListener="#{beanMarque.addmarque}" icon="ui-icon-check" ajax="true"/>

        </h:panelGrid>

    </p:panel>
    <p:dataTable id="tabMarque" var="modelmarque" value="#{beanMarque.listmarques}">

          <p:column headerText="#">
            <h:outputText value="#{modelmarque.idMarque}"/>
          </p:column>

          <p:column headerText="Marques">
            <h:outputText value="#{modelmarque.marqueNom}"/>
          </p:column>


         <p:column headerText="Actions">
             <p:commandButton id="editButton" value="Modifier" icon="fa fa-fw fa-edit" title="Modifier"/>
             <p:commandButton value="Supprimer"
             icon="fa fa-fw fa-remove"
             actionListener="#{beanMarque.removemarque(modelmarque)}"
             update="tabMarque"
             process="@this"
             ajax="true"/>

          </p:column>

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




    </ui:define>

</ui:composition>