Formatting Datatable values

Hello,

I'm working on a plugin and have been able to find solutions to mostly everything from the plugin source code that ships with nop, which is great!

I have not been able to figure out how to, or if it is even possible to, format data values in a datatable.

I want my editable field, which is a decimal value, to show in the datatable like a currency $#,###.##, and then when the user clicks edit on the line, they would see ####.## as the value in the input...is this possible? Since my plugin will be using values into the millions, $14,234,432.55 is much more readable than 14234432.55 for a user.

I can make a string property that contains the formatted number using value.ToString("C") which obviously displays the number how i want to see it, but that property isn't editable as a number because it isn't technically a number anymore.

I think you can use JQuery maskMoney library with data tables https://plentz.github.io/jquery-maskmoney/

Thank you for the suggestion - but i try to avoid adding extra libraries, especially for something so simple, so I instead decided to add my own IRender implementation. RenderCurrency : IRender.

With a small tweak allowing editable number fields to recognize nop-value (if it exists) it all works how I would like.

in \Areas\Admin\Views\Shared\_Table.Definition.cshtml I added a case for RenderCurrency...

case RenderCurrency currency:
        <text>
        render: function (data, type, row) {
              return '<div nop-value="' + data + '">' + new Intl.NumberFormat(`@locale`, { currency: `USD`, style: 'currency', }).format(data) + '</div>';
        } ,
        </text>
        break;

in \Areas\Admin\Views\Shared\Table.cshtml I changed the number section of function setEditStateValue*(){
...
if (columnType == 'number') {
                        var colVal = $(editRowData_@(tableName)[cellName]).attr('nop-value') !== undefined ? $(editRowData_@(tableName)[cellName]).attr('nop-value') : editRowData_@(tableName)[cellName];

                        $($(curRow).children("[data-columnname='" + cellName + "']")[0]).html('<input value="' + colVal + '" class="userinput" type="number" step="any" min="@int.MinValue" max="@int.MaxValue"/>');
                    }
...
}

The only thing preventing this from being useful everywhere is that the currency is hardcoded in Intl.NumberFormat. Is this something I could gather from nop so that it localizes? If yes, then it seems like it could be a nice extension to be added in a future release of nopcom.