Rendering a price breaks hyperlink

usedlens

I have a column which either gives a price or a hyperlink message 'see website'

I don't need a price symbol, but it's missing the two decimal places without using

{ 'data': 'price', render: $.fn.dataTable.render.number( ',', '.', 2, '' ) },

If I do that it breaks the 'see website' hyperlink, because that is not a number...

So how do I manage this?

colin

We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin

kthorngren

Use columns.render as a function and an if statement to determine if the data parameter is a number. If it is then use $.fn.dataTable.render.number() with chained display(data) as shown in this thread or return the link.

Kevin

usedlens

Thank you @kthorngren Here is the working solution

                var resultsTable = $('#resultsTable').DataTable(
                    {
                        'serverSide': true,
                        'deferRender': true,
                         'ajax': {
                            'url': 'data.cfc?method=dataTable'
                         },
                         'columns': [            
                            { 'data': 'productname' },
                            { 'data': 'price', render: function( data, type, row ) {
                                                if ($.isNumeric(data)) {
                                                    return $.fn.dataTable.render.number( '', '.', 2, '£', '').display(data);
                                                } else {
                                                    return data;
                                                }
                                            }
                                            },
                            { 'data': 'retailersite' }
                         ],
                        'columnDefs': [
                           { "targets": [1,2], "searchable": false },
                           { "width":"10%","targets": [1]},
                           { "width":"20%","targets": [2]}
                         ]
                         
                    }
                    
                );