Extjs中更新html内容以及iframe中内容打印

工作一年多来，最近的开发，虽说前台和后台都有分工，但是大部分经历都放在前台，界面上有太多的东西需要修改和完善，调试程序更是需要更多的时间，最近的工作在用xsl写样式将xml中的内容显示在界面上，而我们的界面是基于Extjs的，这样我们就在panel中使用html属性，获取内容显示，这样就存在一个问题，当我们需要更新panel中的内容时该怎么办，换面板是一个可以实现目标的方法，但是这似乎又是很笨的方法，我们需要放两个panel在这里，在苦思冥想后，发现Extjs中的panel有更新html的方法，具体怎么实践，可以看一下例子。

如下代码：先定义panel，panel中的html是已经有内容的，其中的dataURL是个变量，需要到后台程序中取数据

                                    items: [
                                 {
                                     xtype: &＃39;panel&＃39;,
                                     title: &＃39;可视化报告&＃39;,
                                     id:&＃39;InputXMLStylePanel&＃39;,
                                     html:"",
                                     dockedItems: [
                                         {
                                             xtype: &＃39;toolbar&＃39;,
                                             dock: &＃39;top&＃39;,
                                             items: [
                                             {
                                              xtype:&＃39;combobox&＃39;,
                                              displayField:&＃39;fileName&＃39;,
                                              valueField:&＃39;fileIndexId&＃39;,
                                              queryMode:&＃39;local&＃39;,//
                                              id:&＃39;MsgFileName&＃39;,
                                              store:MsgSingleStore,
                                              fieldLabel:&＃39;文件名称&＃39;
                                             
                                             },{
                                              xtype:&＃39;button&＃39;,
                                              text:&＃39;查看&＃39;,
                                              handler:function(){
                                               var fileId = Ext.getCmp(&＃39;MsgFileName&＃39;).getValue();

//我们通过combobox中的不同内容来改变传递到后台的参数，以便获取不同的数据显示，在这里我们就用到Ext.getCmp(&＃39;id&＃39;).update(html)其中id为panel的id值，html为定义的html变量，如下句中的shtml或是html

                                               var urlChange="HTPApp.CSP.App.Result.cls?indexId="+fileId;
                                               var html="";
                                                          Ext.getCmp(&＃39;InputXMLStylePanel&＃39;).update(html);
                                                          var shtml = "";
                                                          Ext.getCmp(&＃39;InputXMLSourcePanel&＃39;).update(shtml);

                                               }
                                              },
                                             {xtype:&＃39;tbfill&＃39;},
                                                 {
                                                     xtype: &＃39;button&＃39;,
                                                     width: 61,

//这部分实现打印功能，可以看出来我们panel中的html是写了一个iframe在打印的时候就可以直接用iframe的name值实现打印，例如下句中 InputXMLStyle.window.print();
其中 InputXMLStyle为上面定义的iframe的name值。
                                                     handler:function(){
                                                    InputXMLStyle.window.print();
                                       },
                                                     text: &＃39;打印&＃39;
                                                 }
                                             ]
                                         }
                                     ]
                                 },
                                 {
                                     xtype: &＃39;panel&＃39;,
                                     id:&＃39;InputXMLSourcePanel&＃39;,
                                     html:"",
                                     title: &＃39;xml源文件&＃39;
                                    
                                 }
                                
                                    ]