`
xsjwan
  • 浏览: 3691 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
最近访客 更多访客>>
文章分类
社区版块
存档分类
最新评论

grid中使一列的宽度自适应

EXT 
阅读更多
设置表格中某一列的宽度自适应,填充grid剩余的宽度:

cm中要设置该列的id:

var cm = new Ext.grid.ColumnModel([{
      header : '编号',
      dataIndex : 'id'
     }, {
      header : '名称',
      dataIndex : 'name'
     }, {
      id : 'description',
      header : '描述',
      dataIndex : 'descn'
     }]);


然后在grid的初始配置中加上:
autoExpandColumn : 'description',  //先在cm中给列加上id,然后设置grid要自动适应的列的id

分享到:
评论

相关推荐

    数据表格JqGrid自适应列宽度

    自适应列宽度可以使表格在不同设备和屏幕分辨率下保持清晰易读,提高用户的浏览体验。 JqGrid自适应列宽度的实现主要依赖于以下几点: 1. **Grid宽度设置**:JqGrid允许设置全局网格宽度(例如,`width`属性),这...

    WPF tab宽度自适应 可关闭

    1. 使用`SharedSizeGroup`:WPF 提供了`Grid`的`SharedSizeGroup`属性,可以共享列宽或行高,实现宽度自适应。在`TabControl`和`TabItem`的`Header`中设置相同的`SharedSizeGroup`。 ```xml <TabControl Grid....

    宽度自适应布局,点击略缩图,大图相册轮播效果

    在“描述”中提到的“和高度固定宽度自适应布局”,可能是指在保持一定宽高比的情况下,宽度自适应,而高度根据宽度按比例调整,这样可以保持内容的视觉一致性。 接着,我们讨论"点击略缩图,大图相册轮播效果"。这...

    EasyUI 数据表格datagrid列自适应内容宽度的实现

    现需求需要加一个表格自适应的功能,触发改功能,改变列宽度,但是不重新渲染表格,不发生数据请求。 设计思路,遍历每项的所有数据,比较字节符串长度,取最大长度。再用最大长度和标题长度比较,如果标题长就去...

    自适应宽度且居中的分页

    标题“自适应宽度且居中的分页”涉及的是网页设计中的一个重要概念,即如何在不同设备和屏幕尺寸下实现分页导航条的自适应布局,同时保持其在页面中的居中对齐。在这个问题中,我们通常会用到前端开发中的响应式设计...

    div+css菜单导航布局自适应宽度

    - **Flexbox**(弹性盒子布局模块):Flexbox允许我们在一行或一列中灵活地排列元素,无论元素数量如何,都可以轻松实现等宽或自适应宽度的布局。 - **Grid布局**:CSS Grid提供了二维布局系统,可以更精细地控制...

    基于ElementUI二次封装的支持自适应列宽的tablecolumn列组件

    它由多个table-column定义,每个table-column对应表格的一列,可以设置字段名、标题、宽度等属性。二次封装的过程就是对这些table-column进行扩展,添加新的功能和行为。 在实现自适应列宽的功能时,我们可能会采用...

    WPF listbox width自适应

    1. **使用Grid布局**:在WPF中,`Grid` 是一种非常灵活的布局容器,它允许子元素按行和列排列,并可以自动调整大小以适应内容或父容器。将`ListBox` 放在`Grid`的一个单元格中,然后不设置固定的宽度,`ListBox`将会...

    PB数据Grod数据窗口列宽度自动适应

    本篇将详细介绍如何实现 PowerBuilder 数据窗口中 Grid 类的列宽度自动适应功能。 #### 二、知识点解析 ##### 2.1 PowerBuilder 数据窗口简介 PowerBuilder 是一款强大的快速应用开发工具,特别适合于企业级应用的...

    CSS 实现div宽度根据内容自适应

    需要注意的是,内联元素如`span`或`a`天生就是宽度自适应的,它们的宽度会根据内容自动调整,但通常不适用于需要换行或独立占据一行的情况,而div作为块级元素,更适合用于构建这样的布局。 此外,还可以使用其他...

    jqGrid的自适应表格

    shrinkToFit: true, // 自适应宽度,使表格宽度与父容器相匹配 height: 'auto', // 自动调整高度,根据数据数量和窗口大小 loadComplete: function () { var $self = $(this); if ($self.jqGrid('getGridParam'...

    通栏自适应浏览器宽度的Banner幻灯片

    例如,当屏幕宽度小于某一阈值时,Banner可能会变为单列布局,而在大屏幕上则呈现多列或全屏展示。 其次,"Banner"通常是指网页顶部的横幅广告或者形象展示区,它可以包含图片、文本、动画等多种元素。在构建自适应...

    jQuery自适应宽度跟高度相册代码

    本教程将详细讲解如何利用jQuery实现一个自适应宽度和高度的相册代码,以适应不同屏幕尺寸和设备。 首先,我们需要理解自适应布局的核心理念。自适应网页设计(Responsive Web Design,简称RWD)是一种让网站在不同...

    CSS网页布局入门教程2:一列自适应宽度

    在CSS中实现一列自适应宽度相对简单,主要是通过将元素的`width`属性设置为百分比值来完成。具体步骤如下: 1. **选择器定义**:首先定义一个ID选择器,例如`#layout`,用于指定需要应用自适应布局的HTML元素。 2. ...

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

    首先,`fitColumns`是EasyUI datagrid的一个配置选项,当设置为`true`时,它会使表格的所有列宽度自动填充整个表格宽度,从而达到列宽自适应的效果。例如,你可以这样设置: ```javascript $('#gvManage').datagrid...

    CSS三列布局两端固定宽度中间自适应

    "CSS三列布局两端固定宽度中间自适应"是一种常见的网页布局模式,它允许页面的两侧栏宽度固定,而中间主要内容区域则根据浏览器窗口大小自适应调整。这种布局方式能够很好地平衡内容展示和用户体验,尤其适用于内容...

    button自适应高度和自动换行

    2. CSS Grid:CSS Grid布局也提供了高度自适应的解决方案。通过`grid-template-columns: auto;`和`grid-auto-rows: min-content;`,可以创建一个网格,使得按钮的高度根据内容自动扩展。 3. JavaScript动态计算:...

    图片排列效果(几行几列宽度固定,高度自适应)

    如果是`grid`布局,可以设置`grid-template-columns`属性定义几列,如`grid-template-columns: repeat(3, 200px)`表示三列,每列宽度200px。对于`flexbox`布局,可以使用`flex-wrap: wrap`让内容换行,`justify-...

    内容自适应垂直居中源码

    2. **CSS Grid布局**:网格布局提供了一种二维布局系统,可以精确控制元素在行和列中的位置。要实现垂直居中,首先设置`display: grid;`,然后利用`align-items: center;`来使内容在网格的每一行中垂直居中。对于自...

    html+css+个人博客自适应布局.zip

    在自适应设计中,CSS3引入了几种关键的技术,如媒体查询(Media Queries)、Flexbox(弹性盒模型)和Grid Layout(网格布局)。媒体查询允许我们根据设备的特定特性,如宽度、高度或方向,应用不同的样式规则。例如...

Global site tag (gtag.js) - Google Analytics