如何让easyui gridview 宽度自适应窗口改变及fitColumns应用

在使用Easyui GridView时，如果要Gridview的宽度和窗口的宽度相同，只需要设置fitColumns: true即可
这样实现以后，如果窗口的大小调整后，gridview的宽度是不会改变的，这时就需要我们自己来我完成了。为window添加一个resize事件，在事件回调方法中让gridview改变宽度即可：


代码如下:

//在调整了窗口大小以后，设置easyui gridview也调整宽度
$(window).resize(function () {
$('#gvManage').datagrid('resize');
});

赞 (0)

相关推荐

  • DevExpress GridControl实现根据RowIndex和VisibleColumnsIndex来获取单元格值

    本文实例展示了DevExpress GridControl实现根据RowIndex和VisibleColumnsIndex来获取单元格值的方法,具体如下所示: 主要功能代码如下: /// <summary> /// 根据rowIndex和visibleColumnsIndex来获取单元格可见值 /// </summary> /// <param name="view">GridView</param> /// <param name

  • ERROR 1222 (21000): The used SELECT statements have a different number of columns

    1) ERROR 1222 (21000): The used SELECT statements have a different number of columns : 这是因为使用union的两个SQL语句产生的记录的表结构不一致. 必须是结构完全一致的记录集合才可以使用UNION. 以上就是两个表的字段不一样,导致,所以大家可以检查下.

  • 在ASP.NET 2.0中操作数据之六十九：处理Computed Columns列

    在ASP.NET 2.0中操作数据之六十九：处理Computed Columns列

    导言: Microsoft SQL Server里有一种computed columns列.这种列的值是通过一个表达式来计算,而表达式引用的是同一张表的其它列的值.打个比方,有一张ServiceLog表,其包含了ServicePerformed, EmployeeID, Rate, Duration等列. 虽然我们可以在一个web页面或其它什么界面里计算每笔服务的费用(也就是 比率 rate乘以时间段duration),不过我们也可以手动向ServiceLog表添加一个 AmountDue列以反

  • 深入浅析MySQL COLUMNS分区

    深入浅析MySQL COLUMNS分区

    介绍 COLUMN分区是5.5开始引入的分区功能,只有RANGE COLUMN和LIST COLUMN这两种分区:支持整形.日期.字符串:RANGE和LIST的分区方式非常的相似. COLUMNS和RANGE和LIST分区的区别 1.针对日期字段的分区就不需要再使用函数进行转换了,例如针对date字段进行分区不需要再使用YEAR()表达式进行转换. 2.COLUMN分区支持多个字段作为分区键但是不支持表达式作为分区键. COLUMNS支持的类型 整形支持:tinyint,smallint,med

  • 如何让easyui gridview 宽度自适应窗口改变及fitColumns应用

    在使用Easyui GridView时,如果要Gridview的宽度和窗口的宽度相同,只需要设置fitColumns: true即可 这样实现以后,如果窗口的大小调整后,gridview的宽度是不会改变的,这时就需要我们自己来我完成了.为window添加一个resize事件,在事件回调方法中让gridview改变宽度即可: 复制代码 代码如下: //在调整了窗口大小以后,设置easyui gridview也调整宽度 $(window).resize(function () { $('#gvMan

  • CSS网页布局入门教程6：左列固定，右列宽度自适应

    在实际应用中,有时候需要左栏固定宽度,右栏根据浏览器窗口大小自动适应,在CSS中实现这样的布局方式是简单可行的,只需在设置左栏的宽度即可,如上例中左右栏都采用了百分比实现了宽度自适应,而我们只需要将左栏宽度设定为固定值,右栏不设置任何宽度值,并且右栏不浮动,代码如下: 复制代码 代码如下: #left {      background-color: #E8F5FE;      border: 1px solid #A9C9E2;      float: left;      height: 3

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

    最近遇到的问题,在使用grid的时候窗口改变了但是grid却不能自适应的改变于是加了一条这行语句 问题就解决了,效果图 拖大后的效果 添加的语句: 复制代码 代码如下: Ext.EventManager.onWindowResize(function(){ grid1.getView().refresh() }) 参看完整代码: 复制代码 代码如下: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m

  • CSS网页布局入门教程5：二列宽度自适应

    从二列固定宽度入手,开始尝试二列布局的情况下,左右栏宽度能够做到自适应,从一列自适应布局中我们知道,设定自适应主要通过宽度的百分比值设置,因此在二列宽度自适应的布局中也同样是对百分比宽度值的设计,继续上面的CSS代码,我们得新定义二列的宽度值: 复制代码 代码如下: #left {      background-color: #E8F5FE;      border: 1px solid #A9C9E2;      float: left;      height: 300px;      w

  • vue中设置echarts宽度自适应的代码步骤

    vue中设置echarts宽度自适应的代码步骤

    目录 问题描述 无自适应效果图 有自适应效果图 代码步骤 问题描述 我们使用vue做项目的时候,常常需要做到echarts图表的自适应,一般是根据页面的宽度做对应的适应.本文记录一下设置echarts图表的自适应的步骤.我们先看一下没有做echarts自适应的效果 无自适应效果图 我们发现echarts图的宽度并没有随着页面宽度的变化而变化 有自适应效果图 很显然,这个才是我们想要的效果 代码步骤 echart图表本身提供了一个resize的函数,我们只需要监听页面的resize变化以后,去执行

  • Vue中使用Echarts可视化图表宽度自适应的完美解决方案

    Vue中使用Echarts可视化图表宽度自适应的完美解决方案

    目录 一.问题阐述: 二.解决思路: 三.最终效果: 一.问题阐述: 开发H5项目中应用到Echarts数据可视化,由于H5主要使用在手机,屏幕宽度大大限制了图表的展现,问题如下. 上图中x轴的数据是动态的,从2022年切换到2021年数据变化,此时如果x轴的数据过多就会显得格外拥挤. 二.解决思路: 我的解决方案是,在放置Echarts的容器(div)外层再套一层容器(div),外层容器宽度固定设置手机屏幕宽,并设置溢出显示滚动条(width: 100%;overflow: auto),内层E

  • iOS 中根据屏幕宽度自适应分布按钮的实例代码

    iOS 中根据屏幕宽度自适应分布按钮的实例代码

    下载demo链接:https://github.com/MinLee6/buttonShow.git 屏幕摆放的控件有两种方式,一种根据具体内容变化,一种根据屏幕宽度变化. 下面我分别将两个方式,用代码的方式呈现: 1:根据具体内容变化 // // StyleOneViewController.m // buttonShow // // Created by limin on 15/06/15. // Copyright © 2015年 信诺汇通信息科技(北京)有限公司. All rights

  • 微信小程序 图片宽度自适应的实现

     微信小程序 图片宽度自适应的实现 实例代码: wxml 代码: <swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}"> <block wx:for="{{imgUrls}}" wx:key="image&

  • input 宽度自适应

    无标题文档 function checkLength(which) { var maxchar=100; var oTextCount = document.getElementById("char"); iCount = which.value.replace(/[^\u0000-\u00ff]/g,"aa").length; if(iCount"+ iCount+""; which.style.border = '1px dotte

  • JS实现DIV高度自适应窗口示例

    本文实例讲述了JS实现DIV高度自适应窗口.分享给大家供大家参考,具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head

随机推荐