使用extjs在浏览器中创建一个窗口浏览器

时间:2009-11-23 15:38:10

标签: extjs

我正在尝试使用extJS在窗口内创建一个迷你浏览器。

这是我到目前为止所拥有的:

panelContent = new Ext.Panel({
        region: 'center',
        margins: '0 0 0 0',
        autoScroll: true,
        html: '<iframe style="overflow:auto;width:100%;height:100%;" frameborder="0"  src="http://www.google.com"></iframe>'
    });
var tb = new Ext.Toolbar();
var combo = new Ext.form.ComboBox({
     width:435,
    });
tb.addField(combo);
tb.doLayout();
browser = new Ext.Window({
        title: 'Internet Browser',
        tbar: tb, 
    closable: true,
        closeAction: 'hide',
        width: 600,
        height: 600,
        border:false,
        plain: true,
        layout: 'border',
        items: [panelContent],
});

我正在尝试让iframe加载组合框内输入的内容,但是我无法找到如何“告诉”他加载页面,我甚至无法“获取”用户点击'enter'。也许用输入框替换组合框?不知道怎么做(从extjs开始)。

感谢您的帮助。

2 个答案:

答案 0 :(得分:15)

你可以试试这个:

Ext.IframeWindow = Ext.extend(Ext.Window, {
onRender: function() {
    this.bodyCfg = {
        tag: 'iframe',
        src: this.src,
        cls: this.bodyCls,
        style: {
            border: '0px none'
        }
    };
    Ext.IframeWindow.superclass.onRender.apply(this, arguments);
}
});

var w = new Ext.IframeWindow({
id:id,
width:640,
height:480,
title:"Knowledge Control Solutions Iframe Window Sample",
src:"http://www.google.es"
})


w.show();

此致

答案 1 :(得分:6)

如果你真的想在Ext JS中使用iframe,你真的应该使用ManagedIFrame user extension。在Ext中使用原始iframe(尤其是内部布局)并不是最容易尝试从头做起的事情。