PDA

View Full Version : Unable to Load Data into JSON-store



Somani
17 Jun 2010, 1:19 PM
Hey

I am not able to load data into my json-store with the designer.

Here's the Code:


AddressStore = Ext.extend(Ext.data.JsonStore, {
constructor: function(cfg) {
cfg = cfg || {};
AddressStore.superclass.constructor.call(this, Ext.apply({
storeId: 'AddressStore',
autoLoad: true,
url: 'includes/handler/address_details.handler.php',
autoDestroy: true,
autoSave: false,
fields: [
{
name: 'gender_address_text'
},
{
name: 'name'
},
{
name: 'fname'
},
{
name: 'street'
},
{
name: 'street_nr'
},
{
name: 'zip'
},
{
name: 'city'
},
{
name: 'country'
}
]
}, cfg));
}
});
new AddressStore();Error:
Unable to load data using the supplied configuration.
Open in Browser: http://localhost/knv_vv/includes/handler/address_details.handler.php

If I open this URL with a Browser i recieve the following JSON-Code:

{"address_id":"1","gender":"1","name":"NAME","fname":"FNAME","street":"STREET","street_nr":"99","zip":"9999","city":"CITY","country":"0","telephone":"1111","mobile":"2222","fax":"3333","email":"mail@domain.com","gender_address_text":"Mr."}Can anyone give me a hint? ;)

Greez

j-joey
17 Jun 2010, 3:20 PM
you are just returning an object. you should return object which contains a record array of objects.

like this:


{ "records":[{"address_id":"1","gender":"1","name":"NAME","fname":"FNAME","street":"STREET","street_nr":"99","zip":"9999","city":"CITY","country":"0","telephone":"1111","mobile":"2222","fax":"3333","email":"mail@domain.com","gender_address_text":"Mr."} ] }

and you should set root property of store to tell which property of incoming object contains data. in my example it's "records"

Somani
18 Jun 2010, 7:38 AM
Hey

I've tried it with your Code and changed the root-property to 'records' - still the same error :(

Somani
18 Jun 2010, 7:55 AM
God damn i'm so stupid -.- i included my header into the handler, so the returned code was more then the json-stuff... i didn't check the source in browser-output, only the human readable :D

jarrednicholls
18 Jun 2010, 8:50 AM
Haha Somani, I've done that before, no worries. Also watch out for PHP warnings and notices, if they are turned on and written out to the response streams then it will affect your data as well.

j-joey
18 Jun 2010, 10:42 AM
don't worry, things happen... i suggest you to test your projects with firebug under firefox. it will save lots of time...

Somani
18 Jun 2010, 11:20 PM
don't worry, things happen... i suggest you to test your projects with firebug under firefox. it will save lots of time...
Yeah i did use firebug when i solved the problem, but not from the beginnig -.- a mistake i would not commit again ^^

julienbouetard
10 Aug 2010, 4:50 PM
HI everyone,

I have the same error as Somani, however when I copy my JSON manually into data it works well and I can load the records but not directly from the url.

Here is my code :


structureTypeCode = Ext.extend(Ext.data.JsonStore, {
constructor: function(cfg) {
cfg = cfg || {};
structureTypeCode.superclass.constructor.call(this, Ext.apply({
storeId: 'structureTypeCode',
totalProperty: 'results',
url: '/crws/smvc/oneoff/new/oneOffDropDownPopulation.html?actionType=getStrucTypeCode',
fields: [
{
name: 'value1'
}
]
}, cfg));
}
});
new structureTypeCode();


and the data returned from my url is



{ metaData: { totalProperty: 'results', root: 'strucTypeCodeRoot', id: 'value1', fields: [ {name:'deleted'}, {name:'id'}, {name:'updated'}, {name:'value1'}, {name:'value2'} ] }, results:2,strucTypeCodeRoot:[{"deleted":false,"id":"","updated":false,"value1":"CRED","value2":"CRED"},{"deleted":false,"id":"","updated":false,"value1":"UMBR","value2":"UMBR"}]}


thanks for any thoughts about that matter,

cheers

Julien

jarrednicholls
11 Aug 2010, 5:59 AM
Hi Julien,

On first glance it looks okay to me. Have you tried configuring the store explicitly, and omit the metaData object...just to see if it works with just the data coming back? My thought is that it doesn't have to do with that.

You could attach an event listener to the store's "exception" event handler, and write out the responseText directly to see if its indeed the "only" thing coming back from the server (or you could use Firebug). Just a thought. There are other helpful items in the exception event that might tell the problem: http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataProxy&member=exception

julienbouetard
12 Aug 2010, 4:50 PM
Hi Jarred,

Actually when I export the project it is working fine in my web browser with or without the metadata. Could that come from a problem of proxy settings ?

cheers

Julien

jarrednicholls
12 Aug 2010, 9:23 PM
Ah, yes perhaps. If you are configured to communicate through a proxy, the default "whitelist" is 127.0.0.1, localhost, and all private subnet address spaces (http://en.wikipedia.org/wiki/Private_network). If you are trying to load data from outside of that whitelist that shouldn't be going through the proxy, then it would definitely cause problems as the software will try to route calls outside of the whitelist through the proxy server.

julienbouetard
15 Aug 2010, 11:29 PM
Hi Jarred,

I was calling the Json using localhost so with your explanation that should not be the problem.

As it is working fine when i export the data, could there be a problem on how the charachters are sent to the designer.

Thanks for your help in that matter.

cheers

Julien

poly.xtian
27 Sep 2010, 6:40 PM
Hi Experts,

I'm really newbie. I cannot load the data from the database. Help me please. Here are the codes:

inhabitants_data.php

<?php
$conn = mysql_connect("localhost", "root", "") or die (mysql_error ());
$db = mysql_select_db ("basid") or die (mysql_error ());

$result = mysql_query ("SELECT * FROM inhabitant") or die (mysql_error ());

$data = array();

while ($row=mysql_fetch_object($result))
{
$data [] = $row;
}

echo json_encode($data);
?>


db-grid.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="http://localhost/gridandjson/resources/css/ext-all.css"/>

<script type="text/javascript" src="http://localhost/gridandjson/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="http://localhost/gridandjson/ext-all.js"></script>


</head>
<body>
<script type="text/javascript">
InhabitantsMasterUi = Ext.extend(Ext.Window, {
title: 'Barangay Automated System and Inhabitants Database - Barangay Looc',
width: 960,
height: 580,
layout: 'border',
hideBorders: true,
closable: false,
y: 10,
resizable: false,
initComponent: function() {
this.items = [
{
xtype: 'panel',
title: 'Inhabitants',
region: 'west',
width: 156,
frame: true,
collapsible: true,
collapseMode: 'standard',
padding: '',
items: [
{
xtype: 'textfield',
width: 142,
emptyText: 'Search'
},
{
xtype: 'spacer',
height: 5
},
{
xtype: 'panel',
title: 'Tasks',
frame: true,
collapsible: true,
height: 135,
layout: 'vbox',
layoutConfig: {
align: 'stretch'
},
items: [
{
xtype: 'button',
text: 'View All Records',
flex: 1
},
{
xtype: 'button',
text: 'Add a New Inhabitant',
flex: 1
},
{
xtype: 'button',
text: 'Edit Inhabitant',
flex: 1
},
{
xtype: 'button',
text: 'Delete inhabitant',
flex: 1
}
]
},
{
xtype: 'spacer',
height: 5
},
{
xtype: 'panel',
title: 'Reports',
collapsible: true,
height: 297,
layout: 'vbox',
frame: true,
layoutConfig: {
align: 'stretch'
},
items: [
{
xtype: 'button',
text: 'Whole Barangay',
flex: 1
},
{
xtype: 'button',
text: 'Per Subdivision',
flex: 1
},
{
xtype: 'button',
text: 'Per Purok',
flex: 1
},
{
xtype: 'button',
text: 'Per Street',
flex: 1
},
{
xtype: 'button',
text: 'Per Household',
flex: 1
},
{
xtype: 'button',
text: 'By Last Name',
flex: 1
},
{
xtype: 'button',
text: 'By Age',
flex: 1
},
{
xtype: 'button',
text: 'By Marital Status',
flex: 1
},
{
xtype: 'button',
text: 'By Religion',
flex: 1
},
{
xtype: 'button',
text: 'By Employment Status',
flex: 1
},
{
xtype: 'button',
text: 'Lessee',
flex: 1
},
{
xtype: 'button',
text: 'Senior Citizen',
flex: 1
}
]
}
]
},
{
xtype: 'grid',
title: 'Records of Registered Barangay Inhabitants',
store: 'InhabitantsStore',
height: 211,
region: 'center',
trackMouseOver: true,
columnLines: true,
frame: true,
columns: [
{
xtype: 'gridcolumn',
header: 'Last Name',
sortable: true,
width: 100,
dataIndex: 'lastname'
},
{
xtype: 'gridcolumn',
header: 'First Name',
sortable: true,
width: 100,
dataIndex: 'firstname'
},
{
xtype: 'gridcolumn',
header: 'Middle Name',
sortable: true,
width: 100,
dataIndex: 'middlename'
}

]
}
];
InhabitantsMasterUi.superclass.initComponent.call(this);
}
});
</script>
<script type="text/javascript">
InhabitantsMaster = Ext.extend(InhabitantsMasterUi, {
initComponent: function() {
InhabitantsMaster.superclass.initComponent.call(this);
}
});

</script>


<script type="text/javascript">
InhabitantsStore = Ext.extend(Ext.data.JsonStore, {
constructor: function(cfg) {
cfg = cfg || {};
InhabitantsStore.superclass.constructor.call(this, Ext.apply({
storeId: 'InhabitantsStore',
url: 'inhabitants_data.php',
root: 'data',
fields: [
{
name: 'lastname'
},
{
name: 'firstname'
},
{
name: 'middlename'
}

]
}, cfg));
}
});
new InhabitantsStore();

</script>


<script type="text/javascript">

Ext.onReady(function() {
Ext.QuickTips.init();
var cmp1 = new InhabitantsMaster({
renderTo: Ext.getBody()
});
cmp1.show();
});

</script>
</body>
</html>


Cheers,
Poly Xtian

jarrednicholls
28 Sep 2010, 4:59 AM
Hi Poly,

You have supplied a "root" configuration on the store, but are not actually passing back the array of data behind a "root" object property.

What you're returning:


[{"firstname":"first","lastname":"last"}]


What is expected based on the configuration:


{"data":[{"firstname":"first","lastname":"last"}]}


So try removing the "root", or simply modify your response JSON.

Hope that helps!

poly.xtian
29 Sep 2010, 1:38 AM
Hi Jarred,

Thanks for the reply.

However i cant still get it. Can you just provide me the right code for this? God bless!

jarrednicholls
29 Sep 2010, 4:43 PM
Hey Poly,

With your original configuration, try this instead:



<?php
$conn = mysql_connect("localhost", "root", "") or die (mysql_error ());
$db = mysql_select_db ("basid") or die (mysql_error ());

$result = mysql_query ("SELECT * FROM inhabitant") or die (mysql_error ());

$data = array();

while ($row=mysql_fetch_object($result))
{
$data [] = $row;
}

echo json_encode(array("data" => $data));
?>


Notice all that's changed is that we're returning an array that's wrapping your $data array, Since your original store's configuration had a root of "data" setup. Does that makes sense?

poly.xtian
29 Sep 2010, 5:16 PM
Hi Jarred,

Still no good. Perhaps I'm still missing something on db-grid.php maybe on Ext.onReady?

poly.xtian
30 Sep 2010, 5:31 AM
Hey Jarred,

Problem solved! thanks alot man!

jarrednicholls
30 Sep 2010, 7:10 AM
Great to hear! What was your final solution, out of curiosity?

poly.xtian
3 Oct 2010, 4:46 PM
sorry for the late reply. I just enable the autoload Jarred. :-)