在ExtJS裏遍歷顯示圖片

代碼採用MVC模式，關鍵代碼以下：

controller層

if (panelsArray.length == 0) {
            var editPropertyData = Ext.widget('ContractFind').show();
            var form = editPropertyData.down('form');
            form.getForm()
                    .loadRecord(grid.getSelectionModel().getSelection()[0]);
            
                    
            var conid = select.get('conid');
            var conthistoryreason = select.get('conthistoryreason');
            
            var flag = document.getElementById('div333');
                                        if(flag==null){
                                            //建立一個div
                                            var div = document.createElement('div');
                                            //設置div的屬性
                                            div.innerHTML = conthistoryreason; //設置顯示的數據，能夠是標籤．
//                                            div.style.background = "blue";//設置css樣式,s設置背景顏色\
                                            div.style.overflow = "auto";//設置css樣式,overflow:auto\
                                            div.id='div333';
                                            var bo = document.body;//獲取body對象.
                                            //動態插入到body中
                                            bo.insertBefore(div,bo.lastChild);
                                            
                                        }
            
            //獲取圖片數據源,傳參並加載
            var StoreTP = Ext.getCmp('pattstoidfj').getStore();
            params = " and o.archiveid="+conid+" and o.pattachmenttype=2";
            params = escape(params);
            StoreTP.on("beforeload", function(store, options) {
                    Ext.apply(store.proxy.extraParams, {
                                params : params
                            });
                });
            StoreTP.load();        
                    
                    
//            editPropertyData.show();
}

view層

function showimg(o){
    
            var editPropertyData = Ext.widget('ImgFind');
            
            Ext.getCmp("imglooks")
                    .setSrc(o.src);
            editPropertyData.show();
        
}

//圖片宮格主要用了ExtJs的DataView，這段代碼寫在view層的最上面，做用是展現從後臺取到的圖片。能夠用html標籤展現。
//「var imageTpl」是給下面的一個引用
var imageTpl = new Ext.XTemplate(
'<tpl for=".">',
       '<div style="margin-bottom: 10px; margin:18px;float:left" class="thumb-wrap">',
          '<img width="150" onclick="showimg(this)" height="180" src="'+getRootPath()+'/images/property/'+'{pattachmentimgpath}">',
          '<br/><span align="center">{pattachmentname}</span>',
        '</div>',
           '</tpl>'
);

Ext.define('hwxx.view.find.PropertyFind', {

。。。。。

xtype: 'tabpanel',
                    activeTab: 0,
                    items: [
                    {
                      xtype: 'panel',
                            title: '宣傳圖列表',
                            items: [
                                {
                                    xtype: 'dataview',
                                    height: 217,
                                    store:'PattachmentStoDBTP',
                                    id:'pattstoidtp',
                                    name:'dbimgstp',
                                    autoScroll: true,
//                                    title : '圖片列表',
                                    tpl: imageTpl,
                                    itemSelector: 'div.thumb-wrap',
                                    emptyText: '沒有可用的圖片'
}
}
}