如何使用 javascript/jquery 将数字格式化为印度货币(在数据表中)
Posted
技术标签:
【中文标题】如何使用 javascript/jquery 将数字格式化为印度货币(在数据表中)【英文标题】:How to format numbers into indian currency (in datatable) using javascript/jquery 【发布时间】:2018-11-19 11:03:30 【问题描述】:我有一个基于 json 数据渲染的数据表,我正在对数据表进行渲染,但问题是我必须将金额格式化为印度货币,例如 27227004,我希望它是 2,72,22,004
$(document).ready(function ()
var table_data =
[
[
"CHEF BAKERS ***FIELD",
"0",
"2967629",
"0"
],
[
"CHEF BAKERS ARAKERE",
"0",
"302542",
"0"
],
[
"CHEF BAKERS AYYAPPA NGR",
"0",
"425433",
"0"
],
[
"Chef Bakers Bellandur",
"0",
"1278244",
"0"
],
[
"CHEF BAKERS BAGMANE CBP",
"0",
"546345",
"0"
],
[
"CHEF BAKERS CHANDAPURA",
"0",
"167527",
"0"
],
[
"Chef Bakers Doddanekkundi",
"0",
"490462",
"0"
],
[
"CHEF BAKERS SIDDAPURA",
"0",
"461639",
"0"
],
[
"CHEF BAKERS ECITY",
"0",
"699634",
"0"
],
[
"CHEF BAKERS VYDEHI",
"0",
"459675",
"0"
],
[
"CHEF BAKERS HARLUR ROAD",
"0",
"229458",
"0"
],
[
"Chef Bakers Hennur Main Road",
"0",
"211808",
"0"
],
[
"CHEF BAKERS HSR LAYOUT",
"0",
"806820",
"0"
],
[
"CHEF BAKERS KADUBEESANAHALLI",
"0",
"1108619",
"0"
],
[
"CHEF BAKERS COFFEE BOARD",
"0",
"774311",
"0"
],
[
"Chef Bakers Kaggadasapura",
"0",
"280712",
"0"
],
[
"Chef Bakers Koramangala",
"0",
"345426",
"0"
],
[
"CHEF BAKERS KASAVANAHALLI",
"0",
"415546",
"0"
],
[
"Chef Bakers Marathahalli 1",
"0",
"525344",
"0"
],
[
"Chef bakers Marathahalli 2",
"0",
"507047",
"0"
],
[
"Chef Bakers Mahadevapura",
"0",
"2518170",
"0"
],
[
"CHEF BAKERS BEL LAYOUT",
"0",
"404171",
"0"
],
[
"CHEF BAKERS MG ROAD",
"0",
"450749",
"0"
],
[
"CHEF BAKERS MANYATA TECH PARK",
"0",
"428558",
"0"
],
[
"CHEF BAKERS NAGAWARA",
"0",
"444891",
"0"
],
[
"CHEF BAKERS PRESTIGE SHANTHINIKETAN",
"0",
"576911",
"0"
],
[
"CHEF BAKERS PRITECH",
"0",
"1269371",
"0"
],
[
"CHEF BAKERS RR NAGAR",
"0",
"566927",
"0"
],
[
"Chef Bakers Kadugodi",
"0",
"1199501",
"0"
],
[
"CHEF BAKERS SARJAPURA ROAD",
"0",
"457940",
"0"
],
[
"CHEF BAKERS SINGASANDRA",
"0",
"245249",
"0"
],
[
"CHEF BAKERS SPICE GARDEN",
"0",
"434369",
"0"
],
[
"Chef Bakers Whitefield",
"0",
"1360325",
"0"
],
[
"CHEF BAKERS YELAHANKA",
"0",
"1213855",
"0"
]
]
var table = $('#example').DataTable(
data: table_data,
"scrollY": "200px",
"scrollCollapse": true,
);
);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet"/>
<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<table id="example" class="table table-striped ">
<thead>
<tr>
<th>Outlet</th>
<th>MTD</th>
<th>YTD</th>
<th>Todays's Transaction</th>
</tr>
</thead>
</table>
我想做的是将数字格式化为印度货币
请有任何想法的人指导我
【问题讨论】:
我无法通过 java 实现这一点,java 与 javascript 完全不同 试试这个:***.com/questions/2901102/… @MayankPandeyz 我知道我知道,但我得到的 json 仅来自 java 端 看看这个***.com/questions/7327046/jquery-number-formatting 也许对你有用***.com/questions/47789487/… 【参考方案1】:我准备了带有印度语言环境的示例 fiddle
var table = $('#example').DataTable(
data: table_data,
"scrollY": "200px",
"scrollCollapse": true,
"columnDefs": [
"targets": [2],
"render": function(data, type, row)
return Number(data).toLocaleString('en-IN',
maximumFractionDigits: 2,
style: 'currency',
currency: 'INR'
);
]
);
【讨论】:
嘿,您的解决方案对我有用,但在其他列中还有一件事,即 MTD 它也可以有数字,现在显示为 0,但将来它可以是任何数字..所以我该怎么做其他栏目也 嘿,我附上了更新的小提琴jsfiddle.net/Dganenco/bukp9myh/5。您应该对要自定义的任何列使用 columnDefs 细看datatables.net/examples/advanced_init/column_render.html列渲染官方文档。问候 嘿,它成功了...... :) 我可以问一个小问题吗? 我想将一些列数据向右对齐,即 MTD 和 YTD 我怎样才能做到这一点?【参考方案2】:你可以和toLocaleString一起使用
function formatNumber()
var number = parseFloat($("#test").val());
console.log(number.toLocaleString('en-IN'));
formatNumber();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="test" value="2967629" />
<input type="button" onclick="formatNumber()" value="Format Number" />
【讨论】:
我已经知道如何使用 .tostring 函数格式化购买,但是我如何在我的表格中应用数据表格,请问您可以编辑我的代码吗?【参考方案3】:在特定列上尝试数据表 rander 选项
$(document).ready(function ()
var table_data=[["CHEF BAKERS ***FIELD","0","2967629","0"],["CHEF BAKERS ARAKERE","0","302542","0"],["CHEF BAKERS AYYAPPA NGR","0","425433","0"],["Chef Bakers Bellandur","0","1278244","0"],["CHEF BAKERS BAGMANE CBP","0","546345","0"],["CHEF BAKERS CHANDAPURA","0","167527","0"],["Chef Bakers Doddanekkundi","0","490462","0"],["CHEF BAKERS SIDDAPURA","0","461639","0"],["CHEF BAKERS ECITY","0","699634","0"],["CHEF BAKERS VYDEHI","0","459675","0"],["CHEF BAKERS HARLUR ROAD","0","229458","0"],["Chef Bakers Hennur Main Road","0","211808","0"],["CHEF BAKERS HSR LAYOUT","0","806820","0"],["CHEF BAKERS KADUBEESANAHALLI","0","1108619","0"],["CHEF BAKERS COFFEE BOARD","0","774311","0"],["Chef Bakers Kaggadasapura","0","280712","0"],["Chef Bakers Koramangala","0","345426","0"],["CHEF BAKERS KASAVANAHALLI","0","415546","0"],["Chef Bakers Marathahalli 1","0","525344","0"],["Chef bakers Marathahalli 2","0","507047","0"],["Chef Bakers Mahadevapura","0","2518170","0"],["CHEF BAKERS BEL LAYOUT","0","404171","0"],["CHEF BAKERS MG ROAD","0","450749","0"],["CHEF BAKERS MANYATA TECH PARK","0","428558","0"],["CHEF BAKERS NAGAWARA","0","444891","0"],["CHEF BAKERS PRESTIGE SHANTHINIKETAN","0","576911","0"],["CHEF BAKERS PRITECH","0","1269371","0"],["CHEF BAKERS RR NAGAR","0","566927","0"],["Chef Bakers Kadugodi","0","1199501","0"],["CHEF BAKERS SARJAPURA ROAD","0","457940","0"],["CHEF BAKERS SINGASANDRA","0","245249","0"],["CHEF BAKERS SPICE GARDEN","0","434369","0"],["Chef Bakers Whitefield","0","1360325","0"],["CHEF BAKERS YELAHANKA","0","1213855","0"]];
var table = $('#example').DataTable(
data: table_data,
"scrollY": "200px",
"scrollCollapse": true,
"columns": [
mData: '0' ,
mData: '1' ,
mData: '2', render: function (data, type, row, meta)
return parseFloat(data).toLocaleString('en-IN');
,
mData: '3'
]
);
);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet"/>
<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/currencyformatter.js/2.2.0/currencyFormatter.min.js"></script>
<table id="example" class="table table-striped ">
<thead>
<tr>
<th>Outlet</th>
<th>MTD</th>
<th>YTD</th>
<th>Todays's Transaction</th>
</tr>
</thead>
</table>
【讨论】:
嘿哥们几乎就在那里,但它不是像 for302542 这样的印度格式,它给出 302,542.00 它应该给出 3,02,542......我可以使用 .toLocaleString(' en-in') ..我怎么用这个 请立即查看 是的,伙计,它的工作原理..我也可以问一个小问题吗?【参考方案4】:$(document).ready(function()
var table = $('#example').DataTable(
data: table_data,
columns: [
data: 'Outlet' ,
data: 'MTD' ,
data: 'YTD', render: function (data, type, row)
var data = parseFloat(data);
return data.toLocaleString('en-IN');
,
data: 'Todays\'s Transaction' ,
],
"scrollY": "200px",
"scrollCollapse": true,
);
);
【讨论】:
【参考方案5】:您可以在将数据传递给数据表之前自行格式化数据,如下所示:
/**
* formatNum - Formats given number with n decimals and separated by x length of sections
* example: formatNum(1000000) -> gives : 100.000
*
* @param integer n: length of decimal
* @param integer x: length of sections
*/
const formatNum = function (num, n, x)
const re = `\\d(?=(\\d$x || 3)+$n > 0 ? '\\.' : '$')`
// Convert string to number and do regex replace
return Number(num).toFixed(Math.max(0, ~~n)).replace(new RegExp(re, 'g'), '$&,')
$(document).ready(function ()
var table_data =
[
[
"CHEF BAKERS ***FIELD",
"0",
"2967629",
"0"
],
[
"CHEF BAKERS ARAKERE",
"0",
"302542",
"0"
],
[
"CHEF BAKERS AYYAPPA NGR",
"0",
"425433",
"0"
],
[
"Chef Bakers Bellandur",
"0",
"1278244",
"0"
],
[
"CHEF BAKERS BAGMANE CBP",
"0",
"546345",
"0"
],
[
"CHEF BAKERS CHANDAPURA",
"0",
"167527",
"0"
],
[
"Chef Bakers Doddanekkundi",
"0",
"490462",
"0"
],
[
"CHEF BAKERS SIDDAPURA",
"0",
"461639",
"0"
],
[
"CHEF BAKERS ECITY",
"0",
"699634",
"0"
],
[
"CHEF BAKERS VYDEHI",
"0",
"459675",
"0"
],
[
"CHEF BAKERS HARLUR ROAD",
"0",
"229458",
"0"
],
[
"Chef Bakers Hennur Main Road",
"0",
"211808",
"0"
],
[
"CHEF BAKERS HSR LAYOUT",
"0",
"806820",
"0"
],
[
"CHEF BAKERS KADUBEESANAHALLI",
"0",
"1108619",
"0"
],
[
"CHEF BAKERS COFFEE BOARD",
"0",
"774311",
"0"
],
[
"Chef Bakers Kaggadasapura",
"0",
"280712",
"0"
],
[
"Chef Bakers Koramangala",
"0",
"345426",
"0"
],
[
"CHEF BAKERS KASAVANAHALLI",
"0",
"415546",
"0"
],
[
"Chef Bakers Marathahalli 1",
"0",
"525344",
"0"
],
[
"Chef bakers Marathahalli 2",
"0",
"507047",
"0"
],
[
"Chef Bakers Mahadevapura",
"0",
"2518170",
"0"
],
[
"CHEF BAKERS BEL LAYOUT",
"0",
"404171",
"0"
],
[
"CHEF BAKERS MG ROAD",
"0",
"450749",
"0"
],
[
"CHEF BAKERS MANYATA TECH PARK",
"0",
"428558",
"0"
],
[
"CHEF BAKERS NAGAWARA",
"0",
"444891",
"0"
],
[
"CHEF BAKERS PRESTIGE SHANTHINIKETAN",
"0",
"576911",
"0"
],
[
"CHEF BAKERS PRITECH",
"0",
"1269371",
"0"
],
[
"CHEF BAKERS RR NAGAR",
"0",
"566927",
"0"
],
[
"Chef Bakers Kadugodi",
"0",
"1199501",
"0"
],
[
"CHEF BAKERS SARJAPURA ROAD",
"0",
"457940",
"0"
],
[
"CHEF BAKERS SINGASANDRA",
"0",
"245249",
"0"
],
[
"CHEF BAKERS SPICE GARDEN",
"0",
"434369",
"0"
],
[
"Chef Bakers Whitefield",
"0",
"1360325",
"0"
],
[
"CHEF BAKERS YELAHANKA",
"0",
"1213855",
"0"
]
].map(i => [i[0], i[1], formatNum(i[2]), i[3]])
var table = $('#example').DataTable(
data: table_data,
"scrollY": "200px",
"scrollCollapse": true,
);
);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet"/>
<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<table id="example" class="table table-striped ">
<thead>
<tr>
<th>Outlet</th>
<th>MTD</th>
<th>YTD</th>
<th>Todays's Transaction</th>
</tr>
</thead>
</table>
编辑
这里是带有 toLocaleString 的版本(只需将格式化功能更改为此):
const formatNum = function (num)
return (parseFloat(num)).toLocaleString('en-IN')
【讨论】:
嘿,哥们几乎就在那里,但它不是像 for302542 这样的印度格式,它给出 302,542.00 它应该给出 3,02,542......我可以使用 .toLocaleString(' en-in') ..我怎么用这个 我添加了使用 toLocaleString 而不是手动格式化的函数。以上是关于如何使用 javascript/jquery 将数字格式化为印度货币(在数据表中)的主要内容,如果未能解决你的问题,请参考以下文章