• 设为首页
  • 收藏本站
  • 积分充值
  • VIP赞助
  • 手机版
  • 微博
  • 微信
    微信公众号 添加方式:
    1:搜索微信号(888888
    2:扫描左侧二维码
  • 快捷导航
    福建二哥 门户 查看主题

    解决extjs grid 不随窗口大小自适应的改变问题

    发布者: 嘉6148 | 发布时间: 2025-8-13 19:11| 查看数: 22| 评论数: 0|帖子模式

    最近遇到的问题,在使用grid的时候窗口改变了但是grid却不能自适应的改变于是加了一条这行语句
    问题就解决了,效果图

    拖大后的效果

    添加的语句:

    Ext.EventManager.onWindowResize(function(){
    grid1.getView().refresh()
    })

    参看完整代码;

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>grid</title>
    <link href="../ext/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
    <script src="../ext/adapter/ext/ext-base.js" type="text/javascript"></script>
    <script src="../ext/ext-all.js" type="text/javascript"></script>
    <script type="text/javascript">
    Ext.onReady(function() {
    function renderAdmin()
    {
    return " <span style='cursor:pointer;' onclick='alert();'><img src='../IMAGES/icons/email.jpg'/> </a></span>";
    }
    var sm= new Ext.grid.CheckboxSelectionModel();
    // var sm1= new Ext.grid.RowSelectionModel({singleSelect:true}),
    var cm=new Ext.grid.ColumnModel([
    new Ext.grid.RowNumberer(),
    sm,
    // sm1,
    {header:'<span style="cursor:pointer;"><img src="../IMAGES/icons/email.jpg"/> </a></span>',dataIndex:'admin',width:30,renderer:renderAdmin,sortable:false},
    {header:'ID',dataIndex:'id'},
    {id:'name',header:'名称',dataIndex:'name'},
    {header:'发送人',dataIndex:'from'},
    {header:'收件人',dataIndex:'to'}
    ]);
    var data=[
    ['','001','收件单一','张三','李四'],
    ['','002','收件单二','张四','李五'],
    ['','003','收件单三','张六','李七']
    ];
    var store= new Ext.data.Store({
    proxy:new Ext.data.MemoryProxy(data),
    reader:new Ext.data.ArrayReader({},[
    {name:'admin'},
    {name:'id'},
    {name:'name'} ,
    {name:'from'},
    {name:'to'}
    ])
    });
    store.load();
    var grid1= new Ext.grid.GridPanel({
    renderTo:'grid1',
    name:'grid1',
    layout:'fit' ,
    title:'收件单',
    autoHeight:true,
    autoWidth:true,
    bodyStyle:'width:100%',
    loadMask :true,
    //autoExpandColumn:'name',
    autoWidth:true,
    // tbar:[{text:'发送',
    // icon: '../Images/icons/application_edit.jpg',
    // cls: 'x-btn-text-icon'},
    // {text:'删除',
    // icon: '../Images/icons/application_edit.jpg',
    // cls: 'x-btn-text-icon'}],
    store:store,
    frame:true,
    cm:cm,
    sm:sm,
    viewConfig:{
    forceFit:true},
    listeners : {
    rowdblclick : function(n) {
    //获取当前选中行, 输向
    // debugger;
    var iid= grid.getSelectionModel().getSelected().data.id ;
    window.location.href="SubFrame.html?id="+iid;
    }
    }
    });
    Ext.EventManager.onWindowResize(function(){
    grid1.getView().refresh()
    })
    });
    </script>
    </head>
    <body>
    <div id="grid1" style="width: 100%; height: 100%;">
    </div>
    </body>
    </html>


    来源:互联网
    免责声明:如果侵犯了您的权益,请联系站长(1277306191@qq.com),我们会及时删除侵权内容,谢谢合作!

    最新评论

    QQ Archiver 手机版 小黑屋 福建二哥 ( 闽ICP备2022004717号|闽公网安备35052402000345号 )

    Powered by Discuz! X3.5 © 2001-2023

    快速回复 返回顶部 返回列表