Need help mapping jason

[delebashParticipant]

Trying to create a data adapter from jason url request

Here is the response which is valid jason according to jasonlint. Any help would be appreciated. Thanks
{"__entityModel":"People","__COUNT":3,"__SENT":3,"__FIRST":0,"__ENTITIES":[{"__KEY":"27","__STAMP":11,"ID":27,"firstName":"dan","lastName":"qqqq"},{"__KEY":"26","__STAMP":14,"ID":26,"firstName":"dan","lastName":"rrrr"},{"__KEY":"25","__STAMP":13,"ID":25,"firstName":"dan","lastName":"eeee"}]}

var source =
{
datatype: "json",
root: "__KEY",
id: "ID",
datafields: [
{ name: 'firstName' },
{ name: 'LastName' }
],
url: "http://127.0.0.1:8081/rest/People"
};

var dataAdapter = new $.jqx.dataAdapter(source);

$("#jqxgrid").jqxGrid(
{
width: 670,
source: dataAdapter,
columnsresize: true,
columns: [
{ text: 'First Name', datafield: 'firstName', width: 200 },
{ text: 'Last Name', datafield: 'lastName', width: 170 }
]
});
});

[Peter StoevKeymaster]

Hi delebash,

I think that the root should be set to “__ENTITIES”.

Hope this helps.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[delebashParticipant]

Thanks I’ve tried that and still not getting data, not sure what else to look at. jsonlint shows __Entities as the outer container and the __Key as the first field in each record but still not getting it to work. Thanks.

[Peter StoevKeymaster]

Hi delebash,

Here’s a working demo based on your code: http://jsfiddle.net/jqwidgets/ctvE8/

The code is:

var data = [{
    "__entityModel": "People",
    "__COUNT": 3,
    "__SENT": 3,
    "__FIRST": 0,
    "__ENTITIES": [{
        "__KEY": "27",
        "__STAMP": 11,
        "ID": 27,
        "firstName": "dan",
        "lastName": "qqqq"},
    {
        "__KEY": "26",
        "__STAMP": 14,
        "ID": 26,
        "firstName": "dan",
        "lastName": "rrrr"},
    {
        "__KEY": "25",
        "__STAMP": 13,
        "ID": 25,
        "firstName": "dan",
        "lastName": "eeee"}]}];
var source = {
    datatype: "json",
    root: "__ENTITIES",
    id: "ID",
    datafields: [
        {
        name: 'firstName'},
    {
        name: 'lastName'}
    ],
    localdata: data
};
var dataAdapter = new $.jqx.dataAdapter(source);
$("#jqxgrid").jqxGrid({
    width: 370,
    source: dataAdapter,
    columnsresize: true,
    columns: [
        {
        text: 'First Name',
        datafield: 'firstName',
        width: 200},
    {
        text: 'Last Name',
        datafield: 'lastName',
        width: 170}
    ]
});​

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[delebashParticipant]

Thank you very much for the example but I still am not getting data for some reason. The only difference I see is that
I am using url: “http://127.0.0.1:8081/rest/People” and also not using data: since I no parameters are required for this
request. Is there a debugger event I can trap to see if the request is going out and what exact data is being returned? I really appreciate you taking the time to help. Thanks, very much!

In this example the Grid is bound to a Remote Data.

$(document).ready(function () {
//var theme = getTheme();
// prepare the data
var source = {
datatype: "json",
root: "__ENTITIES",
id: "ID",
datafields: [
{
name: 'firstName'},
{
name: 'lastName'}
],
url: "http://127.0.0.1:8081/rest/People"

};
var dataAdapter = new $.jqx.dataAdapter(source);

$("#jqxgrid").jqxGrid({
width: 370,
source: dataAdapter,
columnsresize: true,
columns: [
{
text: 'First Name',
datafield: 'firstName',
width: 200},
{
text: 'Last Name',
datafield: 'lastName',
width: 170}
]
});
});

[Peter StoevKeymaster]

Hi delebash,

You can use the jqxDataAdapter’s loadComplete and loadError callback functions for debugging purposes. You can read more about them here: jquery-data-adapter.htm.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[delebashParticipant]

Thanks again for helping, I have been hacking away at it but still unable to get the data returned the rest service is
working at http://ageektech.no-ip.org:8081/rest/People

I have the events trapped but none of them show any data being returned or any error msg besides “error” I am at
a loss as to what to check for troubleshooting.

Thanks again,
Dan

$(document).ready(function () {
//var theme = getTheme();
// prepare the data
var source = {
datatype: "json",
root: "__ENTITIES",
id: "ID",
datafields: [
{
name: 'firstName'},
{
name: 'lastName'}
],
url: "http://127.0.0.1:8081/rest/People"

};

var dataAdapter = new $.jqx.dataAdapter(source,
{
loadComplete: function () {
alert("loadcomplete")
var length = dataAdapter.records.length;
},
beforeSend: function (jqXHR, settings) {
alert("before send")
debugger;
},
loadError: function (jqXHR, status, error) {
debugger;
alert("load error")
}
}
);

$("#jqxgrid").jqxGrid({
width: 370,
source: dataAdapter,
columnsresize: true,
columns: [
{
text: 'First Name',
datafield: 'firstName',
width: 200},
{
text: 'Last Name',
datafield: 'lastName',
width: 170}
]
});
});

[Peter StoevKeymaster]

Hi delebash,

I think the data should be formatted like that:

[{
    "__entityModel": "People",
    "__COUNT": 3,
    "__SENT": 3,
    "__FIRST": 0,
    "__ENTITIES": [{
        "__KEY": "27",
        "__STAMP": 11,
        "ID": 27,
        "firstName": "dan",
        "lastName": "qqqq"},
    {
        "__KEY": "26",
        "__STAMP": 14,
        "ID": 26,
        "firstName": "dan",
        "lastName": "rrrr"},
    {
        "__KEY": "25",
        "__STAMP": 13,
        "ID": 25,
        "firstName": "dan",
        "lastName": "eeee"}]}]

not:

{
    "__entityModel": "People",
    "__COUNT": 3,
    "__SENT": 3,
    "__FIRST": 0,
    "__ENTITIES": [{
        "__KEY": "27",
        "__STAMP": 11,
        "ID": 27,
        "firstName": "dan",
        "lastName": "qqqq"},
    {
        "__KEY": "26",
        "__STAMP": 14,
        "ID": 26,
        "firstName": "dan",
        "lastName": "rrrr"},
    {
        "__KEY": "25",
        "__STAMP": 13,
        "ID": 25,
        "firstName": "dan",
        "lastName": "eeee"}]}

I also think you should use JSONP, not JSON in that scenario.

Example:

var source = {
    datatype: "jsonp",
    root: "__ENTITIES",
    id: "ID",
    datafields: [
    {
        name: 'firstName'
    },
    {
        name: 'lastName'
    }
    ],
    url: "http://ageektech.no-ip.org:8081/rest/People"
};

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[delebashParticipant]

Thanks Peter,

I don’t have access to changing the rest data as it is provided by wakanda server which is supposed to output valid jason. I have also tried jasonp but I still get an error call not made with jasonp. Again sorry for the trouble, I am working with wakanda as well to see if they can help. I have tried just a straight jquery ajax rest request and still getting errors. I just don’t know enough about jquery rest to troubleshoot the problem. Thanks again for taking your time to help, greatly appreciated!!

[delebashParticipant]

Peter,

Thanks for your help the grid is loading now. The problem was a cross-origin policy conflict with wkanda data since it is only
outputting in json and not jsonp so we created a wrapper call to output it using json bypassing cross-origin policy. Thanks again for
all your help.

Dan

[Author]

Posts