`
gingguoqiu
  • 浏览: 25534 次
  • 性别: Icon_minigender_1
  • 来自: 南京
社区版块
存档分类
最新评论

dhtmlxGrid实现setColumnHidden

 
阅读更多

 

 

/** 设置TD隐藏或显示 by 20140814 **/
function cellHidden(cell, state) {
  if ((state) && (cell.style.display != "none")) {
    cell.style.display = "none";
  };
  if ((!state) && (cell.style.display == "none")) {
    cell.style.display = "";
  };
}
 

  

 

  this.rowsBuffer = dhtmlxArray();
  this.rowsCol = dhtmlxArray();
  /** 列是否隐藏-数组 by 20140814 **/
  this.colHiddenArr = {};

 

 

  this.setColumnSizes = function(gridWidth) {
    var summ = 0;
    var fcols = [];
    for (var i = 0; i < this._cCount; i++) {
      if ((this.initCellWidth[i] == "*") && !this._hrrar[i]) {
        this._awdth = false;
        fcols.push(i);
        continue
      };
      if (this.cellWidthType == '%') {
        if (typeof this.cellWidthPC[i] == "undefined")
          this.cellWidthPC[i] = this.initCellWidth[i];
        this.cellWidthPX[i] = Math.floor(gridWidth * this.cellWidthPC[i] / 100) || 0
      } else {
        if (typeof this.cellWidthPX[i] == "undefined")
          this.cellWidthPX[i] = this.initCellWidth[i]
      };

      /** 计算列总宽度时,忽略隐藏列 by 20140814 **/
      if (!this._hrrar[i] && !this.colHiddenArr[i])
        summ += this.cellWidthPX[i] * 1
    };
    if (fcols.length) {
      var ms = Math.floor((gridWidth - summ) / fcols.length);
      if (ms < 0)
        ms = 1;
      for (var i = 0; i < fcols.length; i++) {
        var next = Math.max((this._drsclmW ? this._drsclmW[fcols[i]] : 0), ms)
        this.cellWidthPX[fcols[i]] = next;
        summ += next
      };
      this._setAutoResize()
    };
    this.obj.style.width = summ + "px";
    this.hdr.style.width = summ + "px";
    if (this.ftr)
      this.ftr.style.width = summ + "px";
    this.chngCellWidth();
    return summ
  };

 

 

  this.chngCellWidth = function() {
    if ((_isOpera) && (this.ftr))
      this.ftr.width = this.objBox.scrollWidth + "px";
    var l = this._cCount;
    for (var i = 0; i < l; i++) {
      this.hdr.rows[0].cells[i].style.width = this.cellWidthPX[i] + "px";
      this.obj.rows[0].childNodes[i].style.width = this.cellWidthPX[i] + "px";
      if (this.ftr)
        this.ftr.rows[0].cells[i].style.width = this.cellWidthPX[i] + "px"

      /** 针对列表中已有数据和列,判断隐藏|显示 by 20140814 **/
      cellHidden(this.hdr.rows[0].childNodes[i], this.colHiddenArr[i]);
      cellHidden(this.obj.rows[0].childNodes[i], this.colHiddenArr[i]);
      if (this.ftr)
        cellHidden(this.ftr.rows[0].cells[i], this.colHiddenArr[i]);

    }
  };

 

 

 setRowHidden : function (id, state) {},
 
  /**  设置列隐藏|显示 by qiugq 20140814 **/
  setColumnHidden : function(cin, state) {
    this.colHiddenArr[cin] = state;

    var z = this.hdr.rows[1];
    for (var i = 0; i < z.cells.length; i++) {
      if (z.cells[i]._cellIndexS == cin) {
        cellHidden(z.cells[i], state);
      }
    }

    for (var i = 0; i < this.rowsBuffer.length; i++) {
      var c = this.rowsBuffer[i];
      var cell = (c._childIndexes ? c.childNodes[c._childIndexes[cin]] : c.childNodes[cin]);
      cellHidden(cell, state);
    }

    this.setColumnSizes();
  },

  

 

  

  _fillRow : function(r, text) {
    if (this.editor)
      this.editStop();
    for (var i = 0; i < r.childNodes.length; i++) {

      /** 加载数据时判断列是否隐藏 by 20140814 **/
      cellHidden (r.childNodes[i], this.colHiddenArr[i])

      if ((i < text.length) || (this.defVal[i])) {
        var ii = r.childNodes[i]._cellIndex;
        var val = text[ii];
        var aeditor = this.cells4(r.childNodes[i]);
        if ((this.defVal[ii]) && ((val == "") || (typeof(val) == "undefined")))
          val = this.defVal[ii];
        if (aeditor)
          aeditor.setValue(val)
      } else {
        r.childNodes[i].innerHTML = "&nbsp;";
        r.childNodes[i]._clearCell = true
      }
    };
    return r
  },

 

 

 

 调用API

setColumnHidden(ind, state)

  • ind - column index
  • state - true/false - hide/show column

 

分享到:
评论

相关推荐

    DhtmlxGrid 分页的自定义模板,DhtmlxGrid复选框多选整行 dhtmlxgrid自定义按钮

    DhtmlxGrid的自定义的分页样式,不是他们内部的三种皮肤分页; 本篇还有dhtmlxgird没有的复选框选中整行的效果,dhtmlxgrid多行选中使用的是 [Ctrl+鼠标]、[Shift+鼠标],在国内大部分的体验操作都是第一列放复选框的...

    dhtmlxgrid专业版下载

    dhtmlxGrid是一款功能强大的JavaScript数据网格组件,用于在Web应用程序中展示和操作表格数据。它提供了丰富的功能,包括排序、过滤、分页、编辑、拖放等,以满足专业级的数据管理需求。这款组件是dhtmlx Suite的一...

    dhtmlxGrid介绍及使用手册(中文版)

    9. **控制于一体的网络和树**: dhtmlxGrid可以实现树形和网络数据结构的统一展示,适合复杂的层级关系展示。 #### dhtmlxgrid配置部分 1. **表格操作API**: 包含一系列函数来操作表格,如添加事件处理器、添加页脚...

    DhtmlxGrid 分页的自定义,DhtmlxGrid复选框多选整行

    DhtmlxGrid的自定义的分页样式,不是他们内部的三种皮肤分页; 本篇还有dhtmlxgird没有的复选框选中整行的效果,dhtmlxgrid多行选中使用的是 [Ctrl+鼠标]、[Shift+鼠标],在国内大部分的体验操作都是第一列放复选框的...

    dhtmlxgrid 1.4 pro

    **dhtmlxGrid 1.4 Pro 知识点详解** **一、dhtmlxGrid 概述** dhtmlxGrid 是一款基于JavaScript的高性能数据网格组件,它由DHX Suite提供,是一款专业的Web应用程序开发工具。dhtmlxGrid 1.4 Pro版本在早期的1.x...

    dhtmlxGrid取一列方法

    在给定的代码片段中,可以看到dhtmlxGrid通过监听`onRowSelect`事件来实现对特定行的选择操作,并从中获取所需列的数据。以下是对该过程的详细解释: #### 1. 监听onRowSelect事件 dhtmlxGrid允许开发者通过`...

    DHTMLX grid复制以及分页栏跳转

    下面是一个简单的示例,展示了如何实现DHTMLX Grid的复制和分页栏跳转功能: ```javascript var grid = new dhtmlXGridObject('grid_container'); grid.setImagePath('path/to/images/'); grid.setHeader(...); // ...

    dhtmlxGrid

    3. **分页**:对于大量数据,dhtmlxGrid可以实现分页显示,以优化性能和用户体验。 4. **数据格式化**:dhtmlxGrid允许自定义单元格和行的样式,以及数据的显示格式,使数据呈现更加美观和直观。 5. **拖放功能**...

    dhtmlxGrid v2.0使用手册

    **dhtmlxGrid v2.0使用手册** dhtmlxGrid是一款强大的JavaScript表格控件,广泛应用于Web应用程序中,用于展示、编辑和管理大量数据。它提供了丰富的功能,包括但不限于行和列的动态添加与删除、排序、过滤、分页...

    dhtmlxgrid自定义CELL编辑事件

    在本篇文章中,我们将详细介绍如何自定义dhtmlxgrid的CELL编辑事件,实现自定义的编辑控件。 一、自定义CELL编辑事件 在dhtmlxgrid中,可以通过继承eXcell类来实现自定义的CELL编辑事件。在上面的示例代码中,我们...

    dhtmlxgrid

    从提供的压缩包文件名“Fixed-Header-Table-master”来看,这可能是一个关于DHTMLXGrid实现固定表头的示例项目。通常,这样的项目会包含以下部分: - `index.html`:主页面,展示了如何在网页中嵌入和使用DHTMLX...

    dhtmlxGrid_v14_Pro_70813.zip_dhtmlxgrid

    此外,dhtmlxGrid也可以与后端框架,如PHP、ASP.NET、Java等无缝对接,实现前后端的数据同步。 dhtmlxGrid_v14_Pro_70813这个压缩包中,可能包含以下文件: - `dhtmlxGrid.js`:主库文件,包含了dhtmlxGrid的核心...

    dhtmlxgrid_v1.2_pro真正可用的pro版本

    `dhtmlxGrid` 提供了丰富的事件处理机制,允许开发者通过监听和响应各种用户交互事件,实现定制化的功能。此外,还可以通过插件机制扩展其功能。 **9. 兼容性和适应性:** 这个组件是跨浏览器的,支持所有主流的...

    dhtmlxgrid 专业版 2.5 带例子

    - **AJAX通信**:dhtmlxGrid可以与后台服务器进行异步通信,获取或更新数据,实现动态加载。 - **PHP示例**:虽然2.5专业版的部分PHP示例缺失,但通常会提供与服务器端(如PHP)集成的示例代码,帮助开发者理解...

    dhtmlxGrid_v14_Pro_70813.rar

    7. **API支持**:dhtmlxGrid拥有丰富的API,可以方便地进行事件监听、数据操作、样式设置等,开发者可以定制化实现各种功能。 **二、API介绍** 1. **render()**:初始化或重新渲染网格,通常在数据改变后调用。 2...

    改造过的DhtmlXGrid表格控件

    改造后的DhtmlXGrid可能考虑到了移动设备的适配,实现了响应式布局,使得表格在不同屏幕尺寸下都能保持良好的显示效果。 四、API与扩展性 1. 丰富的API:提供了一系列JavaScript接口,开发者可以通过API进行事件...

    dhtmlxgrid中文帮助文档

    dhtmlXGrid是dhtmlx前台JS组件里应用最多的表格插件,被认为是最好的组件,专业人事做过一系列测试,在众多插件中,此表格表现的效率是最高的

Global site tag (gtag.js) - Google Analytics