Question

您可以使用以下代码填充引导表。

在表格生成期间，如何在数字前格式化并添加"$" 任何数字都应按此顺序$100,00,00.00 or $100,00.00或$ 100.00

显示

这是我的代码

$(function () {
$.getJSON("https://api.myjson.com/bins/89vsf", function (jsonFromFile) {
    $('#table1').bootstrapTable({
        data: jsonFromFile.rows
    })
    var data =  $('#table1').bootstrapTable('getData');
    var total1 = data.reduce(function(a, b){

    return a + parseFloat(b.LongMarketValue.replace('$',''));
}, 0);

document.querySelector('.total1').innerHTML = total1;

});
});

HTML表格

<table id="table1">
                    <thead>
                        <tr>
                         <th data-field="state" data-checkbox="true"></th>
                            <th data-field="Account">Account #</th>
                            <th data-field="ClientName">Client</th>
                            <th data-field="AccountType">Account Type</th>
                            <th data-field="MarketValue"> Market Value</th>
                        </tr>
                    </thead>
                      <tfoot>
                    <tr>
                      <td></td>
                      <td></td>
                      <th></th>
                      <th> Total <span class="total1"></span></th>
                    </tr>
                  </tfoot>
                </table>

JSON

{
          "Name": "Jie wn",
          "Account": "C10",
          "LoanApproved": "12/5/2015",
          "LastActivity": "4/1/2016",
          "PledgedPortfolio": "1000",
          "MaxApprovedLoanAmt": "10000",
          "LoanBalance": "1849000",
          "AvailableCredit": "2877.824375",
          "Aging": "3",
          "Brokerage": "My Broker",
          "Contact": "oJohnson",
          "ContactPhone": "-3614",
          "RiskCategory": "Yellow",
          "rows": [{
            "Account": "06-1234",
            "ClientName": "S Smth",
            "AccountType": "tail",
            "LongMarketValue": "$40000"
          },  {
            "Account": "08-1235",
              "ClientName": "all Sth",
            "AccountType": "REV Trust",
            "LongMarketValue": "$55000"
          },
           {
            "Account": "086-1236",
              "ClientName": "Sly Smith",
            "AccountType": "Reail",
            "LongMarketValue": "$5500"
          }]
        }

Answer 1

您可以使用toLocaleString()将数字转换为货币格式。或者使用正则表达式执行此操作How to print a number with commas as thousands separators in JavaScript

工作示例。

＆＃13;

$(function () {
$.getJSON("https://api.myjson.com/bins/89vsf", function (jsonFromFile) {
    var rows = jsonFromFile.rows.map(function(item){
        item.LongMarketValue = parseFloat(item.LongMarketValue.replace('$',''));
        item.LongMarketValue = getFormattedCurrency(item.LongMarketValue);
        return item;
    });
    $('#table1').bootstrapTable({
        data: rows
    })
    var data =  $('#table1').bootstrapTable('getData');
    var total1 = data.reduce(function(a, b){
      
    return a + parseFloat(b.LongMarketValue.replace('$','').split(',').join(''));
}, 0);

document.querySelector('.total1').innerHTML = getFormattedCurrency(total1);


});
});

function getFormattedCurrency(number){
  return number.toLocaleString('en-US',{style: 'currency', currency: 'USD'});
}

＆＃13;

<!DOCTYPE html>
<html>

  <head>
  </head>

  <body>
    <table id="table1">
                    <thead>
                        <tr>
                         <th data-field="state" data-checkbox="true"></th>
                            <th data-field="Account">Account #</th>
                            <th data-field="ClientName">Client</th>
                            <th data-field="AccountType">Account Type</th>
                            <th data-field="LongMarketValue"> Market Value</th>
                        </tr>
                    </thead>
                      <tfoot>
                    <tr>
                      <td></td>
                      <td></td>
                      <td></td>
                      <th></th>
                      <th> Total <span class="total1"></span></th>
                    </tr>
                  </tfoot>
                </table>
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
	
	<script src="https://rawgit.com/wenzhixin/bootstrap-table/master/src/bootstrap-table.js"></script>    
   <script src="script.js"></script>
  </body>

</html>

＆＃13;

工作plunkr http://plnkr.co/edit/PSCR5iS7DSWkuQb1jv5P?p=preview

希望这有帮助。

Answer 2

我用于此

的几个原型函数

String.prototype.toTwoDecimals = function () {
    var value = this;
    if (isNaN(value)) {
        value = 0;
    }
    return parseFloat(Math.round(value * 100) / 100).toFixed(2);
};

String.prototype.toCommaSeperated = function () {
    var value = this;
    if (isNaN(value)) {
        value = 0;
    }
    while (/(\d+)(\d{3})/.test(value.toString())) {
        value = value.toString().replace(/(\d+)(\d{3})/, '$1' + ',' + '$2');
    }
    return value;
};

String.prototype.toUSD = function () {
    var value = this;
    if (isNaN(value)) {
        value = 0;
    }
    return '$' + this.toString().toTwoDecimals().toCommaSeperated();
};

然后您可以使用"10000".toCommaSeperated()或"100000".toUSD()

Boostrap表如何在数字

2 个答案: