ext 3.x 查看图片 完美解决。

直接上源码,跟同事研究了一整天。很坑。

图片视频一样,先看图片。

var showPig = {
			text: '查看工单图片',
			width: 85,
			disabled: false,
			iconCls: 'download',
			handler:function() {
				var	selectedRecord = grid.getSelectionModel().getSelected();
	            if(selectedRecord == null)
	            {
	                showAlertMsg("没有选择记录",grid);
	                return;
	            }
	            var imgPath = selectedRecord.data.imgPath;//这里是后台返回的图片地址
	            var html = '
';//这里直接是html标签,可以是视频 可以是图片 也可以是音乐mp3 songPlayer.show(); Ext.getCmp("playerPanel").body.update(html); //这里是关键 ,定义的名字为songPlayerwindow的窗口必须先展示(show)否则老是报update -- undefined.这里是清空html重新放置,不然视频图片出来以后,查看别的记录,无法重新加载, //Ext.getCmp('imgsrc').initialConfig.autoEl.src = Ext.contextPath+imgPath; //这种方式无法重新赋值wiodows中 html的内容 } }; var playerForm=new Ext.Panel({ xtype : 'panel', id : 'playerPanel', width:600, height:600, html:"" // html : '' // + '' + // '' }) var songPlayer = new Ext.Window({ layout : 'fit', width:600, height:600, modal : true, frame: true, closable : false, // html:"", items : [playerForm] , buttons: [{ id : 'ensure2', text: '确定', handler: function() { songPlayer.hide(); Ext.getCmp("playerPanel").body.update(""); //Ext.getCmp('playerPanel').remove(); // var oVideo = document.getElementById('videoSource'); // oVideo.pause(); // Ext.getCmp('playerPanel').html =""; // Ext.getCmp('playerPanel').removeAll(); // Ext.getCmp('playerPanel').doLayout(true); } },{ text: '关闭', handler: function() { Ext.getCmp('playerPanel').html =""; Ext.getCmp("playerPanel").body.update(""); // songPlayer.hide(); // Ext.getCmp('playerPanel').remove(); // var oVideo = document.getElementById('videoSource'); // oVideo.pause(); // } }] }); // 菜单集合 var menuArr = new Array(); menuArr.push(showPig);
 var playerForm=new Ext.Panel({  
	        xtype : 'panel',  
	        id : 'playerPanel',  
	        width:600,  
	        height:600, 
	        html:""
//	        html : ''  
//	                + '' +  
//	             ''  
	    })
var songPlayer = new Ext.Window({  
        layout : 'fit',  
        width:600,  
        height:600,  
        modal : true,  
        frame: true,
        closable : false, 
//        html:"",
        items : [playerForm]  ,
    	buttons: [{
			id : 'ensure2',
			text: '确定',
			handler: function() {
                 songPlayer.hide();
				 Ext.getCmp("playerPanel").body.update("");  
				
				//Ext.getCmp('playerPanel').remove();
//				var oVideo = document.getElementById('videoSource');
//				oVideo.pause();
//				  Ext.getCmp('playerPanel').html ="";
//				  Ext.getCmp('playerPanel').removeAll();
//				  Ext.getCmp('playerPanel').doLayout(true);  
				  
			}
		},{
			text: '关闭',
			handler: function() {
                  Ext.getCmp('playerPanel').html ="";
				  Ext.getCmp("playerPanel").body.update("");  
//			
				songPlayer.hide();
//				Ext.getCmp('playerPanel').remove();
//				var oVideo = document.getElementById('videoSource');
//				oVideo.pause();
//				
			}
		}]
    }); 

ext 3.x 查看图片 完美解决。_第1张图片

 

你可能感兴趣的:(js)