# Mostrar fecha y hora en un datatable

![](https://2578941663-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Lc1Wg6ze2c8GK7mFBZX%2F-Lc1WjGeqF4Ig-44ZLgX%2F-Lc1X7EM-L6zkZtPhvmf%2Fcalendar.png?generation=1554820663228766\&alt=media)

Usamos un \<p:calendar con pattern, disabled="true"

```java
   <b:dataTableColumn label="#{msg['field.fechahorapartida']}" >

        <p:calendar  
            disabled="true"

             pattern="dd/MM/yyyy HH:mm:ss" value="#{item.fechahorapartida}"  />

         </b:dataTableColumn>
```

y modificamos el css para cambiar el color de disabled

![](https://2578941663-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Lc1Wg6ze2c8GK7mFBZX%2F-Lc1WjGeqF4Ig-44ZLgX%2F-Lc1X7EPaFHrrC2z6Y3H%2Fcsss.png?generation=1554820662955111\&alt=media)

agregamos

```java
//Color de los disables
.ui-state-disabled {
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)" ; 
    filter: Alpha(Opacity=100) !important;    
    opacity: 100 !important;
    box-shadow:none !important;
    color: #000000 !important;
    font-weight: bold !important; 
    border: none !important;
}
```

## También podemos separar las fechas y horas

![](https://2578941663-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-Lc1Wg6ze2c8GK7mFBZX%2F-Lc1WjGeqF4Ig-44ZLgX%2F-Lc1X7EREMNXJC9lpjAB%2Ffechahorass.png?generation=1554820670172594\&alt=media)

```java
   <b:dataTableColumn label="#{msg['field.fechapartida']}" >
                        <p:calendar  disabled="true"  size="8"                                  
                                     style="background-color: grey;"
                                    pattern="dd/MM/yyyy" value="#{item.fechahorapartida}"  />


                    </b:dataTableColumn> 
                    <b:dataTableColumn label="#{msg['field.horapartida']}" >
                        <p:calendar  disabled="true"    
                                     size="8" 
                                    pattern="HH:mm:ss a" value="#{item.fechahorapartida}"  />

                    </b:dataTableColumn> 
                    <b:dataTableColumn label="#{msg['field.fecharegreso']}" >
                        <p:calendar  disabled="true"    
                                     size="8" 
                                    pattern="dd/MM/yyyy" value="#{item.fechahoraregreso}"  />

                    </b:dataTableColumn> 
                    <b:dataTableColumn label="#{msg['field.horaregreso']}" >
                        <p:calendar  disabled="true"   
                                     size="8" 
                                    pattern="HH:mm:ss a" value="#{item.fechahoraregreso}"  />

                    </b:dataTableColumn>
```
