jqueryprime-ui

PrimeUI Column text formatting


I am using primeUI to generate datatable. I want to format column text. below is my code to load primeUI datatable.

$('#tbl').puidatatable({
        caption: 'Local Datasource',
        columns: [
            {field: 'legendText', headerText: 'Text'},
            {field: 'legendPercentage', headerText: '%age'},
            {field: 'legendValue', headerText: 'value'}
        ],
        datasource: responseData
    });

i want to format column text. Can anyone help me in this? i want value to be currency formatted. and %age column in two decimal format like this.

text| %age |value|

abc | 30.00 |123,3|


Solution

  • According to it's document

    http://www.primefaces.org/primeui/#datatable

    content: A function that takes row data and expects a string or a jQuery object to customize the cell.

    it seems easy,

    columns: [
    { field: 'vin', 
      content: function(rowData) { 
                console.log(rowData);
    //format column data here, then return the formatted value
                return rowData.vin;
                },
      headerText: 'Vin'
    },
    
    {field: 'brand', headerText: 'Brand'},
    {field: 'year', headerText: 'Year'},
    {field: 'color', headerText: 'Color'}
    ]