ExtJs中如何灵活使用Iframe!

xtJS虽然能够作出非常华丽的页面，但对于大量的数据显示来说任然存在着很多的不足！而使用iframe则可以巧妙的解决该问题，使我们运用Ext更加灵活自如，将我们的项目做得更加完美！下面讲述的就是iframe的简单用法：（如有更好的解决方案望各位指出）

1.index.html:

<script type="text/javascript">
  var addWin = null;
  var editWin = null;
  var fun_del ;
   Ext.onReady(function(){
   editWin = new Ext.Window({
   id:'editWin',
    title : '编辑窗口',
    width : 400,
    height : 350,
    modal : true,
    closeAction : 'hide',
    html:'This is editForm!'
   });
   
   addWin = new Ext.Window({
    id:'addWin',
    title : '主窗口',
    width : 400,
    height : 350,
    modal : true,
    closeAction : 'hide',
    html:'<iframe id="frame" name="frame" src="frame.html" width=100% height=100%/>'
   });
   addWin.show();
   
   fun_del = function(){
    alert('This is delete function!');
   }
   });
</script>

 




2.frame.html


<script type="text/javascript">
  function changeWin(){
   Ext.onReady(function() {
      parent.addWin.hide();
      parent.editWin.show();
   });
  }
  function delWin(){
   parent.fun_del();
  }
</script>

<body>
  <a href="">编辑</a>
  <a href="">删除</a>
</body>

 

posted @ 2013-03-28 07:28  杜昊东  阅读(697)  评论(0)  编辑  收藏  举报