Author Topic: load data problem  (Read 2908 times)

bwt

  • Pro Enterprise
  • Newbie
  • *
  • Posts: 17
    • View Profile
load data problem
« on: March 31, 2020, 11:36:07 pm »
Hello,
I'm really novice and I have a problem with loading data.

This is the first sample of the tutorial with no local data because I want to load data from file dati.json that is in the content folder

http://paramtest:8083/computo.htm -> my page
http://paramtest:8083/content/dati.json -> my data

    $(function () {
        var obj = {
            numberCell:{resizable:true,title:"#",width:30,minWidth:30},
            editor: {type: 'textbox'},
            title: "ParamQuery Grid with Array data",
            resizable:true,
            showTop: true,
            showToolbar: true,
            toolbar: {
                items: [{
                    type: "button",
                    label: 'button on toolbar',
                    listener: function () {
                        alert("button clicked");
                    }
                }]
            },
            showHeader: true,
            scrollModel:{autoFit:true, theme:true}
        };
        obj.colModel = [
            { title: "Rank", width: 100, dataType: "integer" },
            { title: "Company", width: 200, dataType: "string" },
            { title: "Revenues ($ millions)", width: 150, dataType: "float", format: '$#,###.00' },
            { title: "Profits ($ millions)", width: 150, dataType: "float", format: '$#,###.00'}
        ];
        obj.dataModel = {
            location: "remote",
            dataType: "JSON",
            method: "GET",
            url: "/content/dati.json"
         };
        $("#grid_array").pqGrid(obj);
    });



dati.json is located in the "content" folder

[
        { "rank": 1, "company": "Exxon Mobil", "revenues": 339938.0, "profits": 36130.0 },
        { "rank": 2, "company": "Wal-Mart Stores", "revenues": 315654.0, "profits": 11231.0 },
        { "rank": 3, "company": "Royal Dutch Shell", "revenues": 306731.0, "profits": 25311.0 },
        { "rank": 4, "company": "BP", "revenues": 267600.0, "profits": 22341.0 },
        { "rank": 5, "company": "General Motors", "revenues": 192604.0, "profits": -10567.0 },
        { "rank": 6, "company": "Chevron", "revenues": 189481.0, "profits": 14099.0 },
        { "rank": 7, "company": "DaimlerChrysler", "revenues": 186106.3, "profits": 3536.3 },
        { "rank": 8, "company": "Toyota Motor", "revenues": 185805.0, "profits": 12119.6 },
        { "rank": 9, "company": "Ford Motor", "revenues": 177210.0, "profits": 2024.0 },
        { "rank": 10, "company": "ConocoPhillips", "revenues": 166683.0, "profits": 13529.0 },
        { "rank": 11, "company": "General Electric", "revenues": 157153.0, "profits": 16353.0 },
        { "rank": 12, "company": "Total", "revenues": 152360.7, "profits": 15250.0 },
        { "rank": 13, "company": "ING Group", "revenues": 138235.3, "profits": 8958.9 },
        { "rank": 14, "company": "Citigroup", "revenues": 131045.0, "profits": 24589.0 },
        { "rank": 15, "company": "AXA", "revenues": 129839.2, "profits": 5186.5 },
        { "rank": 16, "company": "Allianz", "revenues": 121406.0, "profits": 5442.4 },
        { "rank": 17, "company": "Volkswagen", "revenues": 118376.6, "profits": 1391.7 },
        { "rank": 18, "company": "Fortis", "revenues": 112351.4, "profits": 4896.3 },
        { "rank": 19, "company": "Crédit Agricole", "revenues": 110764.6, "profits": 7434.3 },
        { "rank": 20, "company": "American Intl. Group", "revenues": 108905.0, "profits": 10477.0 }
]

There are no rows to display.


The error message is:
TypeError: s is undefined pqgrid.min.js:12:28421
    get_p_data pqgrid.min.js:12
    shiftRC pqgrid.min.js:17
    onDataReadyDone pqgrid.min.js:17
    onDataReadyDone self-hosted:878
    n pqgrid.min.js:9
    _trigger pqgrid.min.js:9
    refreshDataFromDataModel pqgrid.min.js:10
    refreshView pqgrid.min.js:10
    _onDataAvailable pqgrid.min.js:12
    callback pqgrid.min.js:10
    onRemoteSuccess pqgrid.min.js:10
    success pqgrid.min.js:10

Thanks for your help.

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6310
    • View Profile
Re: load data problem
« Reply #1 on: March 31, 2020, 11:47:12 pm »
The data in json file should be in this format:

Code: [Select]
{
  data: [
       { "rank": 1, "company": "Exxon Mobil", "revenues": 339938.0, "profits": 36130.0 },
       { "rank": 2, "company": "Wal-Mart Stores", "revenues": 315654.0, "profits": 11231.0 },
       .....
  ]
}

Example of json data: https://paramquery.com/pro/orders/get?pq_datatype=JSON

bwt

  • Pro Enterprise
  • Newbie
  • *
  • Posts: 17
    • View Profile
Re: load data problem
« Reply #2 on: April 01, 2020, 01:04:15 am »
Thanks for your fast answer :)
the format is correct now because 20 rows have been created but unfortunately, all cells are empty.

A question about the JSON format in case of order and details, the correct format is this:

{
  "orders":[
        { "orderID": 1, "order_date": "20/03/2020", "Total": 339.0, "Freight": 36.0,
      "details":[
         {"OrderID": 1, "ProductID": 12, "Qty": 3, "UP": 4, "Discount": 10},
         {"OrderID": 1, "ProductID": 21, "Qty": 2, "UP": 5, "Discount": 10},
         {"OrderID": 1, "ProductID": 45, "Qty": 1, "UP": 10, "Discount": 10},
      ]},
        { "orderID": 2, "order_date": "25/03/2020", "Total": 400.0, "Freight": 35.0,
      "details":[
         {"OrderID": 2, "ProductID": 33, "Qty": 3, "UP": 43, "Discount": 10},
         {"OrderID": 2, "ProductID": 5, "Qty": 2, "UP": 55, "Discount": 10}
      ]}
         ............
         ............
         ............
      ]
}

or this:

{
  "orders":[
        { "orderID": 1, "order_date": "20/03/2020", "Total": 339.0, "Freight": 36.0},
   { "orderID": 2, "order_date": "25/03/2020", "Total": 400.0, "Freight": 35.0}
   ...........
   ...........
   ...........
      ]
"details":[
      {"OrderID": 1, "ProductID": 12, "Qty": 3, "UP": 4, "Discount": 10},
      {"OrderID": 1, "ProductID": 21, "Qty": 2, "UP": 5, "Discount": 10},
      {"OrderID": 1, "ProductID": 45, "Qty": 1, "UP": 10, "Discount": 10},
      {"OrderID": 2, "ProductID": 33, "Qty": 3, "UP": 43, "Discount": 10},
      {"OrderID": 2, "ProductID": 5, "Qty": 2, "UP": 55, "Discount": 10}
      ..............
      ..............
      ..............
      ]
}

{
   "Order": [

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6310
    • View Profile
Re: load data problem
« Reply #3 on: April 01, 2020, 09:13:19 am »
First fix the grid empty problem. I see that you haven't bind the columns to data.

Please add dataIndx property to the column definitions.

Code: [Select]
{ title: "Rank", width: 100, dataType: "integer", dataIndx: 'rank' },


Please create a separate thread for order details

bwt

  • Pro Enterprise
  • Newbie
  • *
  • Posts: 17
    • View Profile
Re: load data problem
« Reply #4 on: April 01, 2020, 02:30:14 pm »
Thanks a lot and Sorry for my stupid questions.

Regards