I have encounter a problem, the console said my image url is not found. But it displayed well when I directly write in carousel-items-html-src,but it's not working when I use carousel.add to use data in my json.
i have found the cause:the image url is right,but when it in pass course.the image url will auto add a '/' character in the end,so cant display. what can i do?
my controller code:
Ext.define('ylp2p.controller.loadpic',{
extend: 'Ext.app.Controller',
launch: function(){
var storeId = Ext.create('ylp2p.store.picstore');
var imagecarousel = Ext.getCmp('imagecarousel');
storeId.load({
callback: function(records,operation,success){
Ext.each(records,function(record){
imagecarousel.add({html: '<img src='+record.get('url')+'/>'});---is it right?
});
}
});
}
});
the carousel in my view(part code):
{
xtype: 'carousel',
height: 300,
id: 'imagecarousel',
store: 'picstore'
},//end carousel
my json code:
{
"image" : [
{"name" : "cat", "url": "http://bleachthemind.files.wordpress.com/2010/08/cute-bunnys-domestic-animals-2785589-1024-768.jpg"},
{"name" : "lion", "url": "http://images1.fanpop.com/images/photos/2600000/Cheetah-Family-wild-animals-2603080-1280-1024.jpg"},
{"name" : "cat", "url": "http://bleachthemind.files.wordpress.com/2010/08/cute-bunnys-domestic-animals-2785589-1024-768.jpg"}
]
}
the console said:
"GET https://bleachthemind.files.wordpress.com/2010/08/cute-bunnys-domestic-animals-2785589-1024-768.jpg/ 404 (Not Found)"
i got it
imagecarousel.add({html: '<img src='+record.get('url')+' height="100%" width="100%"/>'});