Detect IFrame Load Event

By Vitaliy on April 26, 2012. ExtJS 4.0.7
4765
Reply to thread

Js Code

Ext.widget('panel', {
	title: 'My Slow IFrame',
	width: 300,
	height: 100,
	items: {
		xtype: 'component',
		autoEl: {
			tag: 'iframe',
			style: 'height: 100%; width: 100%; border: none;',
			src: '/PostData/GetContentWithSleep'
		},
		listeners: {
			load: {
				element: 'el',
				fn: function () {
					this.parent().unmask();
				}
			},
			render: function () {
				this.up('panel').body.mask('Loading...');
			}
		}
	},
	renderTo: 'output'
});    

ExtJS 4: Show Pdf In A Panel

By Vitaliy on April 21, 2012. ExtJS 4.0.7
6905
ExtJS 3 version of this post.

Note: you must have PDF plugin installed in your browser.

Js Code

Ext.widget('panel', {
	title: 'My PDF',
	width: 600,
	height: 400,
	items: {
		xtype: 'component',
		autoEl: {
			tag: 'iframe',
			style: 'height: 100%; width: 100%; border: none',
			src: '/files/pdf-sample.pdf'
		}
	},
	renderTo: 'output'
});    

ExtJS 3: Show Pdf In A Panel

By Vitaliy on April 21, 2012. ExtJS 3.4.0
4156
Reply to thread

Note: you must have PDF plugin installed in your browser.

Js Code

Ext.create({
	title: 'My PDF',
	xtype: 'panel',
	width: 600,
	height: 400,
	items: {
		xtype: 'box',
		autoEl: {
			tag: 'iframe',
			style: 'height: 100%; width: 100%',
			src: '/files/pdf-sample.pdf'
		}
	},
	renderTo: 'output'
});