extjs布局面板

//获得 top id 中的div内容

document.getElementById('top').innerHTML

 var viewport = new Ext.Viewport({
             layout:'border',
             items:[
                 { 
                region:'west',
                     id:'west',
                     title:'',
                     split:true,
                     width: 380,
                     minSize: 240,  
                     maxSize: 400,
                     collapsible: true,
                     margins:'3 0 0 0',
                     cmargins:'3 0 1 1',
                     layout:'fit',
                     layoutConfig:{ activeontop:true},
                     defaults: { bodyStyle: 'margin:0;padding:0;'},// document.getElementById('top').innerHTML  获得 top id 中的div内容
                     html: document.getElementById('top').innerHTML+'<br><div id="west_list" style="display:block;"></div>'+document.getElementById('west_content').innerHTML
                 },
                 {
                 region:'center',
                 el:'center',//jsp中必须有一个center   id的div
                 deferredRender:false,
                 margins:'3 0 0 0',
                 html:'<div id="maptools" style="postition:absolute;width:100%;left:0;top:0;"></div><div id="container" style="postition:absolute;width:100%;left:0;top:0;"></div>',
                 autoScroll:true 
               },
             {
                 region:'south',
                 
                 border:false,
                 html:'<div class="menu south"></div>'
              }
             ]
         });
        
        /**********************************************  初始化列表*****************************************************************************/
        proxy =new Ext.data.HttpProxy({url:"locate!findList", method:"post"});
  reader= new Ext.data.JsonReader(
{
root:"results",
totalProperty:"totalCount",
idProperty:'id',
successProperty : '@success' 
},
[
         {name:'id',mapping :'id'},
{name: 'taxpayerName'},
{name: 'longitude'},
{name: 'latitude'}
     ]
  );
store =new Ext.data.Store(
{
proxy:proxy,
reader:reader,
listeners:{
"beforeload" : function(){
     Ext.apply(this.baseParams, {
       datatype : datatype,
               taxpayerName : taxpayerName,
               maxX : maxX,//框选
               maxY : maxY,
               minX : minX,
               minY : minY,
               circularX : circularX,//圆选
               circularY : circularY,
               radius : radius,
               PointS : JSON.stringify(PointS)
                    });
       }
         }
  });




grid=new Ext.grid.GridPanel({
            store:store,
            columns:[ 
{header: "业户名称", width: 360, dataIndex: 'taxpayerName', sortable: true}
                    ],
             renderTo:'west_list',
             width:'100%',
             frame : true,
             loadMask : true,// 载入遮罩动画
             loadMask: {msg:'正在加载数据，请稍侯……'},    
             bbar:new Ext.PagingToolbar({   
                                          pageSize:16,   
                                          store:store,   
                                            displayInfo:true,   
                                          displayMsg:'显示第 {0} 条到 {1} 条记录，一共 {2} 条',   
                                          emptyMsg:'没有记录'   
                                   }),
            tbar:[{
                    id:'btnAdd',
                    text:'业 户 查 询     ',
                    tooltip:'业 户 查 询      ',
                    handler: function(){
                        
            var form = new Ext.form.FormPanel({
            baseCls: 'x-plain',
            labelWidth: 55,
           
            defaultType: 'textfield',


            items: [{
                fieldLabel: '业户名称',
                name: 'taxpayerName',
                anchor:'95%'  
            }]
        });


            var window = new Ext.Window({
            title: '业户查询',
            width: 300,
            height:100, 
            layout: 'fit',
            plain:true,
            bodyStyle:'padding:5px;',
            buttonAlign:'center',
            items: form,
            buttons: [
                    {
                     text: '确定',
                     handler:function()
                     {     
                    taxpayerName=form.getForm().findField("taxpayerName").getValue();
                    window.close(this);
                    loadGrid();//重新加载事件   
                     }
                    }, 
            {
                text: '取消',
                handler:function(){window.close(this);}
            }
            ]
        });


            window.show();
                            }
            },{},{},{
                        id:'btnSel',
                        text:'地 图 单 位 查 询',
                        tooltip:'地 图 单 位 查 询',
                        handler: function(){
                            
                var form = new Ext.form.FormPanel({
                baseCls: 'x-plain',
                labelWidth: 55,
               
                defaultType: 'textfield',


                items: [{
                    fieldLabel: '名 称',
                    name: 'mapUnit',
                    anchor:'95%'  
                }]
            });


                var window = new Ext.Window({
                title: '地 图 单 位 查 询',
                width: 300,
                height:100, 
                layout: 'fit',
                plain:true,
                bodyStyle:'padding:5px;',
                buttonAlign:'center',
                items: form,
                buttons: [
                        {
                         text: '确定',
                         handler:function()
                         {  
                        var dataType = datatype;//地图查询完后恢复原查询条件
                        datatype = "mapUnit";
                        taxpayerName=form.getForm().findField("mapUnit").getValue();
                        window.close(this);
                        loadGrid();
                    datatype = dataType;//地图查询后恢复
                         }
                        }, 
                {
                    text: '取消',
                    handler:function(){window.close(this);}
                }
                ]
            });


                window.show();
                                }
                }]
}); 
store.load({params : {
             start : 0,//开始数
             limit : 16,//每次载入数量，服务器段就根据这两个参数来处理数据分页
             datatype : datatype  //请求类型
         }
}); 
    grid.setHeight(document.body.clientHeight-200);//设置列表高度
grid.render();     


//单击事件   
grid.on('cellclick', function (grid, rowIndex, columnIndex, e) {
    var record = grid.getStore().getAt(rowIndex);
    show_info(record.data.longitude,record.data.latitude);
},   
this);  
   function show_info(x,y)
         {
   map.clearOverlays();
   var pointb = new BMap.Point(parseFloat(x), parseFloat(y)); // 创建点坐标
   map.centerAndZoom(pointb, 17);
   marker = new BMap.Marker(pointb);//添加定位 
   getThemeData();//获得业户周围业户信息
         }