We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Cannot create property 'currency' on string 'C2'

I'm getting this error on the Grid when trying to use the currency format:

Uncaught TypeError: Cannot create property 'currency' on string 'C2'
    at e.getNumberFormat (date-parser.js:148)
    at e.getFormatFunction (file-manager.js:971)
    at new e (file-manager.js:1049)
    at xu (util.js:187)
    at xu (util.js:185)
    at t.render (selection.js:2461)
    at t.appendTo (number-parser.js:69)
    at <anonymous>:2531:17
    at p (jquery.min.js:2)
    at Ia (jquery.min.js:3)


I'm using the latest version (17.3500.0.14) and my datasource is a DataTable as you can see on the attached image. 


This used to work:


@Html.EJS().Grid("gridReport").DataSource(Model).AllowSorting().AllowPaging().AllowPdfExport().AllowExcelExport().Columns(col =>
{
    col.Field("Company_Name").HeaderText("Company").Add();
    col.Field("Job_ID").HeaderText("Job").Add();

    col.Field("Resource_Name").HeaderText("Resource").Add();
    col.Field("Resource_Type").CustomAttributes(new { @class = "type" }).HeaderText("Type").Add();

    col.HeaderText("Quantity").TextAlign(TextAlign.Center).Columns(new List<GridColumn>() { new GridColumn { Field = "Estimated_Qty", HeaderText = "Quoted",TextAlign = TextAlign.Right },
                                                                new GridColumn { Field = "Logged_Qty", HeaderText = "Logged",TextAlign = TextAlign.Right },
                                                                new GridColumn { Field = "Qty", HeaderText = "Billed", TextAlign = TextAlign.Right } }).Add();


    col.HeaderText("Rate").TextAlign(TextAlign.Center).Columns(new List<GridColumn>() { new GridColumn { Field = "Estimated_Rate", HeaderText = "Quoted",TextAlign = TextAlign.Right, Format = "C2" },
                                                                new GridColumn { Field = "Rate", HeaderText = "Billed", TextAlign = TextAlign.Right, Format = "C2" } }).Add();


    col.HeaderText("Total Cost").TextAlign(TextAlign.Center).Columns(new List<GridColumn>() { new GridColumn { Field = "Estimated_Cost", HeaderText = "Quoted",TextAlign = TextAlign.Right, Format = "C2" },
                                                            new GridColumn { Field = "Logged_Cost", HeaderText = "Logged",TextAlign = TextAlign.Right, Format = "C2" },
                                                            new GridColumn { Field = "Cost", HeaderText = "Billed", TextAlign = TextAlign.Right, Format = "C2" } }).Add();

}).DataBound("OnGridLoad").Aggregates(agg =>
{
    agg.Columns(new List<Syncfusion.EJ2.Grids.GridAggregateColumn>
        () { new GridAggregateColumn() { Field = "Estimated_Cost", Type = "Sum", GroupCaptionTemplate = "$${Sum}" }, new GridAggregateColumn() { Field = "Logged_Cost", Type = "Sum", GroupCaptionTemplate = "$${Sum}" }, new GridAggregateColumn() { Field = "Cost", Type = "Sum", GroupCaptionTemplate = "$${Sum}" } }).Add();
}).ToolbarClick("toolbarClick").PageSettings(page => page.PageCount(Math.Ceiling((double)Model.Rows.Count / 20))).AllowGrouping().GroupSettings(group=>group.Columns(new string[] { "Company_Name", "Job_ID" })).Toolbar(new List<string>
            () { "ExcelExport", "PdfExport", "CsvExport", "Print" }).Render()




Attachment: Annotation_20191009_195001_685c5433.zip

15 Replies

TS Thavasianand Sankaranarayanan Syncfusion Team October 10, 2019 08:59 AM UTC

Hi Juan, 
 
Greetings from Syncfusion support. 

Based on your query, We have created the sample but we are unable to reproduce the issue at our end. Please find the below sample link for more information. 


If you still had the issue .Please provide the following details 

  1. Share your sample data list.
  2. If possible try to reproduce the issue with our attached sample.
  3. Please share your complete Grid code example both server and client end.

Regards, 
Thavasianand S. 



JJ Juan Jiminez October 11, 2019 02:17 AM UTC

Hi Thavasianand,

Thanks for the sample.

I was able to track down the issue to an incompatibility with this code snippet we use from agilecrm for live chat support:

 <script id="_agile_min_js" async type="text/javascript" src="https://floodlightsoft.agilecrm.com/stats/min/agile-min.js"></script>
    <script type="text/javascript">
        var Agile_API = Agile_API || {}; Agile_API.on_after_load = function () {
            _agile.set_account('j4vbincjpg460bkkkekbq43hlj', 'floodlightsoft', false);
            _agile.track_page_view();
            _agile_execute_web_rules();
        };
    </script>

When I include that piece of code on my page the browser displays this warning:

"A cookie associated with a cross-site resource at https://floodlightsoft.agilecrm.com/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application>Storage>Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032."

This makes the Grid throw the aforementioned error when using the currency format "Cannot create property 'currency' on string 'C2'" even if I put all Syncfusion scripts before agilecrm. See attached image for the browser's console error.

In this order of ideas, it seems to me the grid should have all JS hooks ready at this point and should work regardless of other JS errors after it?

Attachment: Annotation_20191010_210405_dcc228ee.zip


TS Thavasianand Sankaranarayanan Syncfusion Team October 11, 2019 11:08 AM UTC

Hi Juan, 

From analyzing your query, we suspect that you are facing the control Layouts rendering problem. We suggest you to follow the below order to achieve your requirement. Please refer the below code example for more information. 

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <title>@ViewBag.Title - My ASP.NET Application</title> 
    @* Syncfusion Essential JS 2 Styles *@ 
    <link rel="stylesheet" rel='nofollow' href="https://cdn.syncfusion.com/ej2/material.css" /> 
    @* Syncfusion Essential JS 2 Scripts *@ 
    <script src="~/Scripts/ej2/ej2.js"></script> 
    @Styles.Render("~/Content/css") 
    @Scripts.Render("~/bundles/modernizr")  
 
    @Scripts.Render("~/bundles/jquery")           // Move the Jquery and bootstrap scripts in your header tag 
    @Scripts.Render("~/bundles/bootstrap") 
</head> 
<body> 
    <div class="navbar navbar-inverse navbar-fixed-top"> 
        <div class="container"> 
            <div class="navbar-header"> 
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
                    <span class="icon-bar"></span> 
                    <span class="icon-bar"></span> 
                    <span class="icon-bar"></span> 
                </button> 
                @Html.ActionLink("Application name", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" }) 
            </div> 
            <div class="navbar-collapse collapse"> 
                <ul class="nav navbar-nav"> 
                    <li>@Html.ActionLink("Home", "Index", "Home")</li> 
                    <li>@Html.ActionLink("About", "About", "Home")</li> 
                    <li>@Html.ActionLink("Contact", "Contact", "Home")</li> 
                </ul> 
            </div> 
        </div> 
    </div> 
    <div class="container body-content"> 
        @RenderBody() 
        <hr /> 
        <footer> 
            <p>&copy; @DateTime.Now.Year - My ASP.NET Application</p> 
        </footer> 
    </div> 
    @Html.EJS().ScriptManager()    //The ScriptManager used to place our control initialization script in the page. 
                                     You can place your code after the script manager. 
   
        <script id="_agile_min_js" async type="text/javascript" src="https://floodlightsoft.agilecrm.com/stats/min/agile-min.js"></script> 
    <script type="text/javascript"> 
        var agile_api = agile_api || {}; agile_api.on_after_load = function () { 
            _agile.set_account('j4vbincjpg460bkkkekbq43hlj', 'floodlightsoft', false); 
        _agile.track_page_view() 
        _agile_execute_web_rules(); 
    }; 
    </script>  
</body> 
</html> 
 

Regards, 
Thavasianand S. 



JJ Juan Jiminez October 11, 2019 10:54 PM UTC

Hi Thavasianand ,

I tried the exact same order you provided lo load my bundles but I'm still experiencing the same issue.

See attached file with a modified version of your original sample.


TS Thavasianand Sankaranarayanan Syncfusion Team October 14, 2019 06:35 AM UTC

Hi Juan, 

In the previous update you have mentioned that you have attached some sample but unfortunately we didn’t find any attachments in your update. So, please ensure on your end and re-update your attachments. It would be more helpful for us to provide better assistance. 

Regards, 
Thavasianand S. 



JJ Juan Jiminez October 14, 2019 01:47 PM UTC

Hi Thavasianand,

Here's the file. 

Attachment: Agggrp154930653_6ed0bfa5.zip


TS Thavasianand Sankaranarayanan Syncfusion Team October 15, 2019 01:28 PM UTC

Hi Juan, 

Thanks for your update. 

Before we start providing solution on your query, Please share the below details that will be helpful for us to provide better solution. 

  1. Are you still facing “Cannot create property 'currency' on string 'C2' ” script error ?
  2. Please share the screenshot of your issue.

Regards, 
Thavasianand S. 



JJ Juan Jiminez October 15, 2019 09:05 PM UTC

Hi Thavasianand,

It's the same error. See attached screenshot.

Attachment: Annotation_20191015_160159_e269db0a.zip


TS Thavasianand Sankaranarayanan Syncfusion Team October 17, 2019 08:48 AM UTC

Hi Juan, 

Based on your query we have prepared a sample and achieved your requirement by overriding our updateColumnType method. So we suggest you to follow the below way to achieve your requirement. 
Please refer the below code example and sample for more information. 

@Html.EJS().Grid("Grid").DataSource((IEnumerable<object>)ViewBag.dataSource).Columns(col => 
       { 
 
           col.Field("OrderID").HeaderText("Order ID").Add(); 
           col.Field("Freight").HeaderText("Freight").Format("C2").Add(); 
 
 
       }).Load("load").Render() 
 
<script> 
    function load(args) { 
        var grid = document.getElementsByClassName('e-grid')[0].ej2_instances[0]; 
        grid.renderModule.updateColumnType = function (record) { 
            var columns = this.parent.getColumns(); 
            var value; 
            var cFormat = 'customFormat'; 
            var equalTo = 'equalTo'; 
            var data = record && record.items ? record.items[0] : record; 
            var fmtr = this.locator.getService('valueFormatter'); 
            for (var i = 0, len = columns.length; i < len; i++) { 
                value = ej.base.getValue(columns[i].field || '', data); 
                if (!ej.base.isNullOrUndefined(columns[i][cFormat])) { 
                    columns[i].format = columns[i][cFormat]; 
                } 
                if (!ej.base.isNullOrUndefined(columns[i].validationRules) && !ej.base.isNullOrUndefined(columns[i].validationRules[equalTo])) { 
                    columns[i].validationRules[equalTo][0] = this.parent.element.id + columns[i].validationRules[equalTo][0]; 
                } 
                if (columns[i].isForeignColumn() && columns[i].columnData) { 
                    value = ej.base.getValue(columns[i].foreignKeyValue || '', columns[i].columnData[0]); 
                } 
                if (!ej.base.isNullOrUndefined(value)) { 
                    this.isColTypeDef = true; 
                    if (!columns[i].type) { 
                        columns[i].type = value.getDay ? (value.getHours() > 0 || value.getMinutes() > 0 || 
                            value.getSeconds() > 0 || value.getMilliseconds() > 0 ? 'datetime' : 'date') : typeof (value); 
                    } 
                } 
                else { 
                    columns[i].type = columns[i].type || null; 
                } 
                var valueFormatter = new ej.grids.ValueFormatter(); 
                if ((columns[i].format && typeof columns[i].format === 'object') && (columns[i].format.skeleton || columns[i].format.format)) // your reffered third party script was override this condition. So we override this method and prevent this condition .               { 
                    columns[i].setFormatter(valueFormatter.getFormatFunction(columns[i].format)); 
                    columns[i].setParser(valueFormatter.getParserFunction(columns[i].format)); 
                } 
                if (typeof (columns[i].format) === 'string') { 
                    ej.grids.setFormatter(this.locator, columns[i]); 
                } 
                else if (!columns[i].format && columns[i].type === 'number') { 
                    columns[i].setParser(fmtr.getParserFunction({ format: 'n2' })); 
                } 
            } 
 
        } 
         
        } 
</script> 


Regards, 
Thavasianand S. 



JJ Juan Jiminez October 17, 2019 11:16 PM UTC

Hi Thavasianand ,

Thanks for the workaround, it does work when the Grid is on the main view, however, it fails when you put it inside a partial view which is my current setup (see attached sample). Do you know why is this happening?

Best,


TS Thavasianand Sankaranarayanan Syncfusion Team October 18, 2019 10:56 AM UTC

Hi Juan, 

We can’t able to see  your attachments in this forum. So, can you please re-attach your screen shots. 

Refer the screen shot. 
 
Regards, 
Thavasianand S. 



JJ Juan Jiminez October 18, 2019 02:02 PM UTC

Hi Thavasianand,

I'm reattaching the file.

BTW, I will be off next week so I might not be able to get back to you until the 28th.

Best,

Attachment: format1104203402_(partial_view)_1e614fd2.zip


TS Thavasianand Sankaranarayanan Syncfusion Team October 22, 2019 06:18 AM UTC

Hi Juan, 

Based on your query we have prepared a sample and achieved your requirement by overriding our getFormatFunction and getParserFunction methods. So we suggest you to follow the below way to achieve your requirement. Please refer the below code example and sample for more information. 

function load(args) { 
        ej.grids.ValueFormatter.prototype.getFormatFunction = function (format) { 
            if (format.type) { 
                return ej.base.Internationalization.prototype.getDateFormat(format); 
            } 
            else { 
                if (typeof format === "string") { 
                    format = { format: format };  // your reffered third party script was conflict with our methods. So we override this method and convert the format type to object. 
 
                    return ej.base.Internationalization.prototype.getNumberFormat(format); 
                } 
            } 
 
        } 
 
        ej.grids.ValueFormatter.prototype.getParserFunction = function (format) { 
            if (format.type) { 
                return ej.base.Internationalization.prototype.getDateParser(format); 
            } 
            else { 
                if (typeof format === "string") { 
                    format = { format: format }; 
                    return ej.base.Internationalization.prototype.getNumberParser(format); 
                } 
            } 
        } 
         
         
        } 


Regards,
Thavasianand S. 



JJ Juan Jiminez October 28, 2019 03:00 PM UTC

Hi Thavasianand,

You last sample works pretty well.

Thank you!


BS Balaji Sekar Syncfusion Team October 29, 2019 05:27 AM UTC

Hi Juan, 
 
Thank for your update, 
 
We are happy to hear that the provided solution has been resolved your problem. 
 
Regards, 
Balaji Sekar. 


Loader.
Live Chat Icon For mobile
Up arrow icon