thelastray
thelastray

Reputation: 482

EXTJS JsonStore do not load

I know this will be a repetition. But I have tried my best to solve it, all in vain. I am unable to populate even a simple grid panel!!! Obviously I am a newbie in extjs.

My js code is as follows:

Ext.onReady(function(){
    var store = new Ext.data.JsonStore({        
        url: 'compare.php',             
                fields: ['name', 'area']
               });      

    store.load();
    var grid = new Ext.grid.GridPanel({
        store: store,
        columns: [
        {header: 'Name', width: 100, sortable: true, dataIndex: 'name'},
        {header: 'Position', width: 100, sortable: true, dataIndex: 'area'}          
        ],
        stripeRows: true,
        height:250,
        width:500,
        title:'DB Grid'
    });
    grid.render('db-grid');

});

and my php is as follows:

<html>
<head>
</head>
 <body bgcolor="white">
  <?php
  $link = pg_Connect('host=my_host port=5432 dbname=da_name user=postgres password=my_password');
  $sql = "SELECT name, area FROM \"TABLE\" LIMIT 10";
    if (!$link) {
        echo "error";
    } else {
    $result = pg_query($link, $sql);
    $rows = array();
    $totaldata = pg_num_rows($result);
    while($r = pg_fetch_assoc($result)) {
        $rows[] = $r;
    }
    //echo json_encode($rows);
    //echo json_encode(array('country' => $rows));
    echo '({"total":"'.$totaldata.'","country":'.json_encode($rows).'})';
    }
  ?>
  </body>
</html>

And my json is as follows:

[
    {
        "total": "10",
        "country": [
            {
                "name": "CULTIV",
                "area": "1.10584619505971e-006"
            },
            {
                "name": "CULTIV",
                "area": "2.87818068045453e-006"
            },
            {
                "name": "CULTIV",
                "area": "6.96120082466223e-007"
            },
            {
                "name": "CULTIV",
                "area": "1.17171452984621e-007"
            },
            {
                "name": "CULTIV",
                "area": "1.25584028864978e-006"
            },
            {
                "name": "CULTIV",
                "area": "5.86309965910914e-007"
            },
            {
                "name": "CULTIV",
                "area": "4.12220742873615e-007"
            },
            {
                "name": "CULTIV",
                "area": "7.59690840368421e-006"
            },
            {
                "name": "CULTIV",
                "area": "2.47360731009394e-007"
            },
            {
                "name": "CULTIV",
                "area": "4.04940848284241e-005"
            }
        ]

Do I need to set any proxy for this? Actually my application is running on different server than my database.

Upvotes: 1

Views: 1073

Answers (2)

wes
wes

Reputation: 8215

Your JSON is malformed. Ext.data.JsonReader (automatically configured when you use a JsonStore) expects a JSON object with a root node, defined in your reader config. The reader should throw an exception if the root is undefined.

So define a root for your JsonReader:

var store = new Ext.data.JsonStore({        
    url: 'compare.php',
    root: 'country', // required!
    fields: ['name', 'area']
});

And your JSON should look like this:

{
    "total": 10,
    "country": [{
        "name": "CULTIV",
        "area": "6.96120082466223e-007"
    },{
        ...
    }]
}

Upvotes: 0

Rakoun PointCom
Rakoun PointCom

Reputation: 11

I have no experience in PostgreSQL but I advice you to use pg_fetch_object() function instead of pg_fetch_assoc() in that case.

Try something like this:

while($obj = $result->pg_fetch_object()) {
$rows = $obj;
}    
echo '({"total":"'.$totaldata.'","country":'.json_encode($rows).'})';

Upvotes: 1

Related Questions