PDA

View Full Version : json store giving error on special character '.'



mholmen
2 Aug 2012, 7:49 AM
I am generating a json Store in c# and adding it to my page with the following code:



List<string> json = new List<string>();
// Items look like this:
{ "name": "ASAP", "ASAP": 30, "Phase 2": 10, "test": 5, "Version 2.0 SR 1": 10 }
{ "name": "Phase 2", "ASAP": 12, "Phase 2": 5, "test": 15, "Version 2.0 SR 1": 5 }

List<string> fieldsList = new List<string>();

foreach (string f1 in distinctColTwo)
fieldsList.Add("'" + f1 + "'");

string fields = String.Join(", ", fieldsList.ToArray());
string data = string.Join("," + Environment.NewLine, json.ToArray());

string dataScript = "" + Environment.NewLine +
"var store = Ext.create('Ext.data.JsonStore', {" + Environment.NewLine +
" fields: ['name', " + fields + "]," + Environment.NewLine +
" data: [" + Environment.NewLine +
data + Environment.NewLine +
" ]" + Environment.NewLine +
"});" + Environment.NewLine;

Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "Data", dataScript, true);


This creates the following store object:



var store = Ext.create('Ext.data.JsonStore', {
fields: ["name", "ASAP", "Phase 2", "test", "Version 2.0 SR 1"],
data: [
{ "name": "ASAP", "ASAP": 30, "Phase 2": 10, "test": 5, "Version 2.0 SR 1": 10 } ,
{ "name": "Phase 2", "ASAP": 12, "Phase 2": 5, "test": 15, "Version 2.0 SR 1": 5 }
]
});


When I try to run the code to display a bar chart I get an error:

SCRIPT1004: Expected ';'
ext-all.js, line 18 character 5081

I have determined that this error occurs because of the '.' within the fieldname = "Version 2.0 SR 1". If I remove that field or just remove the '.' everything works.

I have tried '\\.' escaping the period, and I have also tried replacing with \u002E (UTF8) to no avail.

These field names are generated from values returned from our DB so I need to encode or something else to get this to work.

vietits
2 Aug 2012, 11:51 PM
The problem is that your data field names contain special characters. In your case, they are space and dot. You can fix this problem by:
1. Using field names without special characters. One way is to replace special characters in field names with underscores. For example:


var store = Ext.create('Ext.data.JsonStore', {
fields: ["name", "ASAP", "Phase_2", "test", "Version_2_0_SR_1"],
data: [
{ "name": "ASAP", "ASAP": 30, "Phase_2": 10, "test": 5, "Version_2_0_SR_1": 10 } ,
{ "name": "Phase 2", "ASAP": 12, "Phase_2": 5, "test": 15, "Version_2_0_SR_1": 5 }
]
});

2. Configuring proxy reader to use simple accessors:


var store = Ext.create('Ext.data.JsonStore', {
fields: ["name", "ASAP", "Phase 2", "test", "Version 2 0 SR 1"],
data: [
{ "name": "ASAP", "ASAP": 30, "Phase 2": 10, "test": 5, "Version 2 0 SR 1": 10 } ,
{ "name": "Phase 2", "ASAP": 12, "Phase 2": 5, "test": 15, "Version 2 0 SR 1": 5 }
],
proxy: {
type: 'ajax',
reader: {
type: 'json',
useSimpleAccessors: true
}
}
});

mholmen
3 Aug 2012, 5:07 AM
Thanks.

Looks like the proxy option is going to work for my project.