Getting confused with json array parsing

[avp]

Hi, am new to sencha . Iam a little bit confused with parsing json data. I have a panel with different buttons named such as Pilgrim Centres, Picnic Spots, Water Bodies etc. My requirement is that when I click on the button named Pilgrim Centres the names of Pilgrim centres that comes under the category_name: "Pilgrim Centres" from the json must be displayed in a list and so on the other buttons.. Here is my json data:

{"list":[{"name":"Sri Padmanabha Swamy Temple ","specific_name":"TODO","headline":"Belief is that \"Trivandrum City had been built around the temple\" ","description":"It is situated in the heart of Trivandrum City. The presiding diety is \"Lord Padmanabha\", one of the variations of Lord Vishnu. Two festivals are held annually. Only Hindus are allowed inside the temple","rank":"1","mobile":"","phone":"","fax":"","email_id":"","website":"","visiting_hours":"","image_url":"http://itprof.in/keralatourism/yii/demos/keralatourism/images/AttractionImageGallery/Trivandrum_Padmanabhaswamy temple.jpg","district":"Thiruvananthapuram ","category_name":"Pilgrim Centres ","sub_category_name":"Temple ","place":"Thiruvananthapuram "},{"name":"Sri Subramaniyaswamy Temple ","specific_name":"TODO","headline":"Temple dedicated to Lord Subramaniya (Murugan) ","description":"This temple dedicated to Lord Subramaniya (Murugan) is situated 7 kms. From Thiruvananthapuram. ","rank":"0","mobile":"","phone":"","fax":"","email_id":"","website":"","visiting_hours":"","image_url":"http://itprof.in/keralatourism/yii/demos/keralatourism/images/AttractionImageGallery/Trivandrum_Sri Subramaniyaswamy Temple.JPG","district":"Thiruvananthapuram ","category_name":"Pilgrim Centres ","sub_category_name":"Temple ","place":"Ullur "},{"name":"Bhagavathy Temple ","specific_name":"TODO","headline":"The Goddess Kannaki (Parvathi) is the main deity in this temple ","description":"The\u00a0Attukal Bhagavathy Temple\u00a0is a shrine in\u00a0Kerala,\u00a0India.The\u00a0temple\u00a0is renowned for the annual\u00a0Attukal Pongala\u00a0festival, in which over a million women participate.[1]\u00a0Attukal Temple is situated within 2 kilometres of the\u00a0Sree Padmanabhaswamy Temple\u00a0inThiruvananthapuram. ","rank":"0","mobile":"","phone":"","fax":"","email_id":"","website":"","visiting_hours":"","image_url":"http://itprof.in/keralatourism/yii/demos/keralatourism/images/AttractionImageGallery/Bhagavathy Temple_Attukal_tvm.jpg","district":"Thiruvananthapuram ","category_name":"Pilgrim Centres ","sub_category_name":"Temple ","place":"Attukal "},{"name":"Cheeyapara ","specific_name":"TODO","headline":"TODO","description":"TODO","rank":"0","mobile":"","phone":"","fax":"","email_id":"","website":"","visiting_hours":"","image_url":"http://192.168.1.39/yii/demos/keralatourism/images/AttractionImageGallery/Idukki_Cheeyappara Falls.jpg","district":"Idukki ","category_name":"Water bodies ","sub_category_name":"Water falls ","place":"Munnar Hill Station "},{"name":"Thommankuthu ","specific_name":"TODO","headline":"TODO","description":"TODO","rank":"0","mobile":"","phone":"","fax":"","email_id":"","website":"","visiting_hours":"","image_url":"http://192.168.1.39/yii/demos/keralatourism/images/AttractionImageGallery/Idukki_Thommankuthu.JPG","district":"Idukki ","category_name":"Water bodies ","sub_category_name":"Water falls ","place":"Munnar Hill Station "},{"name":"Somatheeram ","specific_name":"TODO","headline":"TODO","description":"TODO","rank":"0","mobile":"","phone":"","fax":"","email_id":"","website":"","visiting_hours":"","image_url":"http://192.168.1.39/yii/demos/keralatourism/images/AttractionImageGallery/Somatheeram_Trivandrum.jpg","district":"Thiruvananthapuram ","category_name":"Picnic Spots ","sub_category_name":"Lake ","place":"Thiruvananthapuram "},{"name":"Kumarakom ","specific_name":"TODO","headline":"TODO","description":"TODO","rank":"0","mobile":"","phone":"","fax":"","email_id":"","website":"","visiting_hours":"","image_url":"http://192.168.1.39/yii/demos/keralatourism/images/AttractionImageGallery/Kottayam_Kumarakom.jpg","district":"Kottayam ","category_name":"Picnic Spots ","sub_category_name":"Lake ","place":"Kottayam "},.......

Iam confused with my code in store:

Ext.define('tourism.store.AttractionMasters',{ extend:'Ext.data.Store',
requires:[
'Ext.data.proxy.JsonP'
],
config:{
model:'tourism.model.AttractionMaster',
proxy:{
type:'jsonp',
url:'http://......./attraction_master.php',
reader:{
type:'json',
rootProperty:'list.name'
}

}

},
autoLoad:true
}
);

My model file: ..



Ext.define('tourism.model.AttractionMaster',{
extend:'Ext.data.Model',
config:{
fields:[
{name:'name',type:'string'},
{name:'headline',type:'string'},
{name:'description',type:'string'},
{name:'rank',type:'string'},
{name:'mobile',type:'string'},
{name:'phone',type:'string'},
{name:'fax',type:'string'},
{name:'email_id',type:'string'},
{name:'website',type:'string'},
{name:'visiting_hours',type:'string'},
{name:'image_url',type:'string'},
{name:'district',type:'string'},
{name:'category_name',type:'string'},
{name:'sub_category_name',type:'string'},
{name:'place',type:'string'}
]
}
});

My list view:

Ext.define('tourism.view.PilgrimCentre',{
extend:'Ext.List',
xtype:'pilgrimcentre',
config:{
title:'Pilgrim Centres',
itemTpl:[
'<img src="{image_url}" width="100px" height="100px">',
'{name}'
],
store:'AttractionMasters',
onItemDisclosure:true
}
});


And code for my button on another view:


xtype:'button', ui: 'plain',
centered:true,
html:'<img src="resources/images/ArtAndCulture.png" height="100%" width="100%" align="center">',
height: 100,
width: 200,
handler: function(button,event){
var sample = Ext.create('tourism.view.PilgrimCentre');
Ext.Viewport.setActiveItem(sample);


Now when I run the code Iam getting the error that

Resource interpreted as Script but transferred with MIME type text/html: "http://itprof.in/keralatourism/yii/d...sonP.callback1".

where should I correct??

pls help me..

[Mthor]

Code tags please.

[James Goddard]

Now when I run the code Iam getting the error that

Resource interpreted as Script but transferred with MIME type text/html: "http://itprof.in/keralatourism/yii/d...sonP.callback1".

where should I correct??

pls help me..

In your attraction_master.php, before your output any text add:

header('Content-type: application/json'); 

[avp]

Where can I do that?
attraction_master.php is coming from server.

[James Goddard]

Well the warning you are seeing is a browser warning because the content type is coming from the server wrong. If you can't fix the server there is nothing you can do about the warning.

[avp]

But I can see the datas in the list view when I save the same json data into a file and changing the code of store into

 config:{             
                autoLoad:true,
                model:'tourism.model.AttractionMaster',
                proxy:{
                     type:'ajax',
                     model: 'tourism.model.AttractionMaster',
                     url:'app/data/attractionmaster.json',
//                   type: 'jsonp',
//                   rootProperty:'list',
//                   url: 'http://............/php/attraction_master.php' ,
                     reader:{
                          type:  'json',
                          root: 'list'
                    }
            }
           
        },

I know it will be any simple issue. But Iam getting stuck on this.

[trongkha]

Please fix the JSONP service return!

JSONP service format:
http://URL?queryparams=values&callback=callbackmethod

JSONP returns string must be
callbackmethod({list:[object,object]});