jqxgrid how to handle carriage return in json

[billelmehdiParticipant]

Hi,

I have json data which includes \n characters. it raises an error in my page:

SyntaxError: Unexpected token in JSON at position 5531
at i.jqx.dataAdapter.loadjson (jqxdata.js:8)
at i.jqx.dataAdapter.dataBind (jqxdata.js:8)

How to handle \n character when data is loaded?

Here is a peace my code:

var data = '[{"id":1,"description":"bla bla \n blo blo\n"}]'; // just an example
var servicesSource = {
    datatype: "json",
    localdata: data,
    datafields: [{
               	  name: 'id',
               	  type: 'number'
               	  }, {
               	  name: 'description',
               	  type: 'string'
   }]
};
var servicesDataAdapter = new $.jqx.dataAdapter(servicesSource);
$("#servicedetailsgrid").jqxGrid({
   width: 800,
   source: servicesDataAdapter,
   selectionmode: 'singlerow',
   editmode: 'selectedrow',
   columns: [
            {text: '', datafield: 'id', width: 0, hidden: true},
            {text: 'Description', columntype: 'textbox', width: '18%', editable: false}]
   });
}

[HristoParticipant]

Hello billelmehdi,

Please, take a look at this example:
http://jsfiddle.net/3dzjuo9f/

Best Regards,
Hristo Hristov

jQWidgets team
https://www.jqwidgets.com

[Yavor DashevParticipant]

Hi billelmehdi,

You can use the ‘cellsrenderer’ function if you want to add new line the cell for example.
This is a code snippet with an example

var data = ‘[{“id”:1,”description”:”bla bla blo blo “}]’; // just an example
var servicesSource = {
datatype: “json”,
localdata: data,
datafields: [{
name: ‘id’,
type: ‘number’
}, {
name: ‘description’,
type: ‘string’
}]
};
// cellsrenderer function
var cellsrenderer = function (row, columnfield, value, defaulthtml, columnproperties, rowdata) {
return ‘<span style=” color:blue;”>’ +'<br>’+ value +'<br>’ + ‘</span>’;
}
var servicesDataAdapter = new $.jqx.dataAdapter(servicesSource);
$(“#servicedetailsgrid”).jqxGrid({
width: 800,
source: servicesDataAdapter,
selectionmode: ‘singlerow’,
editmode: ‘selectedrow’,
columns: [
{text: ‘id’, datafield: ‘id’, width: 50, },
{text: ‘Description’,datafield:’description’, columntype: ‘textbox’, width: ‘18%’, editable: false ,cellsrenderer: cellsrenderer,}]
});

});

Please, do not hesitate to contact us if you have any additional questions.

Best regards,
Yavor Dashev

jQWidgets team
https://www.jqwidgets.com

[Author]

Posts