extjs - how to display image using xtemplate dataview in ext js -
hi i'm creating extjs 4 mvc application in create view named imagegallery in want display image using xtemplate , dataview.
and create panel in panel called dataview , inside dataview called store, unable display image.
please below check code , reply me possible.
ext.define('am.view.user.imagegallery', { extend: 'ext.panel', region: 'center', border: 'false', initcomponent: function () { var imagestore = ext.create('ext.data.store', { fields: ['url', 'name'], data: [{ url: 'images(5).jpg', name: 'images(5).jpg' }] }); // imagetemplate data view var imagetemplate = new ext.xtemplate('<tpl for=".">', '<div class="thumb-wrap" id="{name}">', '<div class="thumb"> <img src="{url}" title="{name}"></div>', '<span>{shortname}</span></div>', '</tpl>'); // dataview gallery var imagedataview = new ext.dataview({ tpl: imagetemplate, singleselect: true, overclass: 'x-view-over', itemselector: 'div.thumb-wrap', loadingtext: 'loading images...', emptytext: '<div style="padding:10px;">no images</div>', store: imagestore }); this.imagepanel = new ext.form.panel({ padding: '5 5 5 5', layout: 'hbox', border: false, title: 'image gallery', height: 800, width: 1000, id: 'img-chooser-view', autoscroll: true, items: [this.imagedataview] }); this.items = [this.imagepanel]; this.callparent(); } });
Comments
Post a Comment