0

I am getting an "SCRIPT438: Object doesn't support property or method 'formatCurrency'"" error when trying to format the currency for cells in a jQuery datatable using the jQuery formatCurrency library.

Code: jQuery DataTable initialisation:

var oTable = $('#tblTest').dataTable({
"bFilter": false,
"bInfo": false,
"aoColumns": [{ "bVisible": false }, null, null, null, null, null, null, null, null, null, null, null, null, null, null, null, null],
"aaSorting": [[0, 'desc', 1]],
"bScrollInfinite": true, //this property disables pagination
"sScrollY": "230px",
"sScrollX": "940px",
"fnCreatedRow": function (nRow, aData, iDataIndex) {
 RefreshGrid();
  }
});

function RefreshGrid() {
        var nRow = $('#tblTest').dataTable().fnGetNodes();
        for (var i = 0; i < nRow.length; i++) {
            var Total = (nRow[i].children[6].children[0].innerHTML * nRow[i].children[7].children[0].innerHTML).toFixed(2);
            $("input[id$='hfFormat']").val(Total);
            var unformatted = $("input[id$='hfFormat']").val();
            var formatted = $("input[id$='hfFormat']").val(unformatted).formatCurrency().val();
            nRow[i].children[8].children[0].innerHTML = formatted; //Total;
            var Veriance = Total - nRow[i].children[11].children[0].value;
            nRow[i].children[13].children[0].innerHTML = Veriance.toFixed(2);


            nRow[i].children[9].children[0].disabled = true; //CrNo
            nRow[i].children[10].children[0].disabled = true; //Allocate
            nRow[i].children[11].children[0].disabled = true; //CrAmount
            nRow[i].children[14].children[0].disabled = true; //Accept Veriance
            nRow[i].children[15].children[0].disabled = true; //Edit

            nRow[i].children[10].children[0].checked = false; //Allocate
            nRow[i].children[14].children[0].checked = false; //Accept Veriance
            nRow[i].children[15].children[0].checked = false; //Edit
            nRow[i].style.backgroundColor = "";

            if (nRow[i].children[12].children[0].defaultValue == "RejectedReturn") {
                nRow[i].style.backgroundColor = "#FFEDE6";
            }
            else if (nRow[i].children[12].children[0].defaultValue == "CompleteWithVariance") {
                nRow[i].children[15].children[0].disabled = false; //Edit
                nRow[i].children[14].children[0].checked = true; //Accept Verianc
                nRow[i].style.backgroundColor = "#D1D1D1";
            }
            else if (nRow[i].children[12].children[0].defaultValue == "Complete") {
                nRow[i].children[15].children[0].disabled = false; //Edit
                nRow[i].children[10].children[0].checked = true; //Allocate
                nRow[i].style.backgroundColor = "#D1D1D1";
            }
            else if (nRow[i].children[12].children[0].defaultValue == "Outstanding") {
                nRow[i].children[9].children[0].disabled = false; //CrNo
                nRow[i].children[10].children[0].disabled = false; //Allocate
                nRow[i].children[11].children[0].disabled = false; //CrAmount
                nRow[i].children[14].children[0].disabled = false; //Accept Veriance
            }
            else if (nRow[i].children[12].children[0].defaultValue == "Partial") {
                nRow[i].children[9].children[0].disabled = false; //CrNo
                nRow[i].children[10].children[0].disabled = false; //Allocate
                nRow[i].children[11].children[0].disabled = false; //CrAmount
                nRow[i].children[14].children[0].disabled = false; //Accept Veriance

            }
        }
    }

The same approach worked in other web pages but the only difference here is that RefreshGrid() is being called from the fnCreatedRow function whereas in the other instances it was called from the fnRowCallback and fnFooterCallback functions. The "unformatted" value will be present in the hidden field.

4

4 回答 4

1

I am unfamiliar with the formatCurrency library, but it looks like you may be attempting to call it on a string in this line:

var formattted = $("input[id$='hfFormat']").val(unformatted).formatCurrency().val();

This line also has a typo in it that I believe is a bug:

var formattted = ...

should be

var formatted = ....


Try changing this like to:

$("input[id$='hfFormat']").val(unformatted);
$("input[id$='hfFormat']").formatCurrency();
var formatted = $("input[id$='hfFormat']").val();


Generally speaking, and though it is not required, it is usually better to NOT chain your method calls, as it gets harder to read, harder to debug, and easier to make mistakes.

Also, consider setting your reused jQuery objects (selected elements) to variables, either globally or locally in a function, based on the scope in which they are to be used. Everytime jQuery hits a selector, it has to search the document to re-find the element(s) to add to the object/collection. This requires a LOT of overhead, which you can cut down by setting selectors that you have already found to be variables. The same goes for the use of $(this), as wrapping it with $() makes it a jQuery object, which is, essentially, a selector, causing jQuery to search the document for the element that matches this.


UPDATE:

Also, check out this answer which demonstrates and explains the calling of the toNumber method (included in the formatCurrency plugin), before calling .formatCurrency(). I have repeated this example, below:

// removes invalid characters, then formats currency
$(selector).toNumber().formatCurrency();
于 2013-04-11T15:41:06.407 回答
0

This is because val() returns you string value, but you should pass input to format function ()

//wrong
var formattted = $("input[id$='hfFormat']").val(unformatted).formatCurrency().val(); 

//right
var input = $("input[id$='hfFormat']");
input.val(unformatted);
var formatted = input.formatCurrency().val();

This fiddle demonstrate my point

于 2013-04-11T15:42:48.437 回答
0

Retrieve the calculated value, store it to the input field, format it, retrieve it back to a new variable.

var Total = (nRow[i].children[6].children[0].innerHTML * nRow[i].children[7].children[0].innerHTML).toFixed(2);
$("input[id$='hfFormat']").val(Total);
$("input[id$='hfFormat']").formatCurrency();
var formatted = $("input[id$='hfFormat']").val();
于 2013-04-11T17:23:44.770 回答
0

Turns out the problem was with duplicated jquery library scripts: on the page and a user control on the page. I moved the script reference to the Master page and removed from the Child pages and controls to avoid the duplication. Thanks for the assistance guys!

于 2013-04-15T11:06:46.043 回答