CODEWITHSUNDEEP
datatabledate-formatdynamic-columns
senthil_sss
senthil_sss

Reputation: 193

Date Format as "MM-dd-yyy" in <p:datatable> with dynamic column

I'm having a datatable with dynamic columns generated. i have a date column to be displayed, but in a specific format

in my datatable without dynamic columns generation ... i make the date to display in the specific format by this way

<p:dataTable .....>
  <p:column headerText="Date" id="dateID"
                        sortBy="#{iterator.updatedDate}"
                        filterBy="#{iterator.updatedDate}">

                        <h:outputText value="#{iterator.updatedDate}">
                            <f:convertDateTime pattern="MM-dd-yyyy" />
                        </h:outputText>

  </p:column>
</p:dataTable>

what could i do for getting the same outcome in my datatable with dynamic columns...

can any help me in fixing this...

Upvotes: 4

Views: 41660

Answers (5)

Amadeus Sanchez
Amadeus Sanchez

Reputation: 2585

I conditionally format the content of the cell. If it will represent data from a Date object I apply a suitable date format.

<ng-template pTemplate="body" let-rowData let-columns="cols" let-d>
    <tr>
      <td *ngFor="let col of cols">
        {{col.field == 'dateUtc'?  (rowData[col.field] | date: 'dd-MM-yyyy'):rowData[col.field]}}
      </td>
    </tr>
</ng-template>

Upvotes: 0

Jayson San Agustin
Jayson San Agustin

Reputation: 1

<p-column field="date" header="Date">
    <ng-template let-col let-car="rowData" pTemplate="body">
        <span>{{car[col.field] | date: 'MM-dd-yyy'}}</span>
    </ng-template>
</p-column>

see: https://www.primefaces.org/primeng/#/datatable/templating https://angular.io/api/common/DatePipe

Upvotes: 0

rodolfocop
rodolfocop

Reputation: 72

You need to replace your markup with the following:

<p-column headerText="Date" id="dateID">
     <ng-template let-col let-car="rowData" pTemplate="body">
        <span>{{car[col.field] | date: 'MM-dd-yyyy'}}</span>
     </ng-template>
</p-column>

Upvotes: 3

Talles Penini
Talles Penini

Reputation: 89

If your property is a Calendar type insert .time after it. 

<h:outputText value="#{iterator.updatedDate.time}">
       <f:convertDateTime pattern="MM-dd-yyyy" />
 </h:outputText>

Upvotes: 6

floshton
floshton

Reputation: 41

You could create accessor methods in your backing bean that enable you to directly get the Date in the desired format, as a String.

Take this example:

public class MyBean{

    private Date myDate;

    public Date getMyDate() {
        return myDate;
    }

    public String getMyFormattedDate() {
        return new SimpleDateFormat("dd-MM-yyyy").format(myDate);
    }
}

Then, in your dataTable, the property "myFormattedDate" should be called, so the formatted Date gets printed.

Upvotes: 4

Related Questions