admin管理员组文章数量:1323508
How can I re-render this Ext.Component when a bo box option is selected?
var searchForm = Ext.create('Ext.form.Panel', {
width: 320,
style: 'margin: 20px',
renderTo: 'SearchPanel',
style: {
position: 'fixed',
top: '0px',
left: '865px'
},
items: [{
xtype: 'bo',
width: 300,
labelAlign: 'right',
fieldLabel: 'Subject Area',
store: subjectAreaStore,
valueField: 'id',
displayField: 'value',
typeAhead: true,
mode: 'local',
triggerAction: 'all',
selectOnFocus: true,
value: 'Account',
listeners: {
select: function (bo) {
cmp.autoEl.src = '/' + bo.getValue() + '/2nd Iteration.htm';
alert(cmp.autoEl.src);
cmp.render(); // this does not work!
}
} // listeners
}]
});
// create the cmp
var cmp = Ext.create('Ext.Component', {
title: 'Data Models',
style: {
width: '100%',
height: '750px'
},
autoEl : {
tag : 'iframe',
src : '/Account/2nd Iteration.htm'
},
renderTo: 'models'
});
Update: 10/23/2012:
This isn't working yet:
listeners: {
select: function (bo) {
cmp.autoEl.src = '/' + bo.getValue() + '/2nd Iteration.htm';
var the_iframe = cmp.getEl().dom;
the_iframe.contentWindow.location.reload();
}
} // listeners
How can I re-render this Ext.Component when a bo box option is selected?
var searchForm = Ext.create('Ext.form.Panel', {
width: 320,
style: 'margin: 20px',
renderTo: 'SearchPanel',
style: {
position: 'fixed',
top: '0px',
left: '865px'
},
items: [{
xtype: 'bo',
width: 300,
labelAlign: 'right',
fieldLabel: 'Subject Area',
store: subjectAreaStore,
valueField: 'id',
displayField: 'value',
typeAhead: true,
mode: 'local',
triggerAction: 'all',
selectOnFocus: true,
value: 'Account',
listeners: {
select: function (bo) {
cmp.autoEl.src = '/' + bo.getValue() + '/2nd Iteration.htm';
alert(cmp.autoEl.src);
cmp.render(); // this does not work!
}
} // listeners
}]
});
// create the cmp
var cmp = Ext.create('Ext.Component', {
title: 'Data Models',
style: {
width: '100%',
height: '750px'
},
autoEl : {
tag : 'iframe',
src : '/Account/2nd Iteration.htm'
},
renderTo: 'models'
});
Update: 10/23/2012:
This isn't working yet:
listeners: {
select: function (bo) {
cmp.autoEl.src = '/' + bo.getValue() + '/2nd Iteration.htm';
var the_iframe = cmp.getEl().dom;
the_iframe.contentWindow.location.reload();
}
} // listeners
Share
edited Oct 23, 2012 at 13:13
JustBeingHelpful
asked Oct 23, 2012 at 2:33
JustBeingHelpfulJustBeingHelpful
19k39 gold badges168 silver badges251 bronze badges
2
- You should try using the Ext.ux.IFrame extension instead of a ponent. Check the latest docs under "ux" and add the file to your project. – Eric Commented Oct 23, 2012 at 16:43
- @AndreKR - I'll try it tomorrow when I get to work – JustBeingHelpful Commented Oct 24, 2012 at 1:43
2 Answers
Reset to default 4I would suggest a different approach to creating the iframe. Just use the html property of a ponent and write the html yourself instead of using the autoel feature (never done this with a ponent, only a container but it should work the same)...
var cmp = Ext.create('Ext.Component', {
title: 'Data Models',
style: {
width: '100%',
height: '750px'
},
renderTo: 'models',
html: '<iframe src="/Account/2nd Iteration.htm"></iframe>'
});
Then do this in the listener to update it...
listeners: {
select: function (bo) {
cmp.update('<iframe src="/' + bo.getValue() + '/2nd Iteration.htm"></iframe>');
}
}
The render()
method only deals with HTML that was created (rendered) by ExtJS. You created that iframe yourself, so you have to control it yourself. You should be able to get the DOM element from the Component like this:
var the_iframe = cmp.getEl().dom;
the_iframe.contentWindow.location.reload();
本文标签: javascriptExtJS 4 How do I Rerender ExtComponent iframeStack Overflow
版权声明:本文标题:javascript - ExtJS 4: How do I Re-render Ext.Component iframe? - Stack Overflow 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://www.betaflare.com/web/1742138809a2422488.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论