举个应用场景的例子来说明:

在采购单的编辑页面,上方为采购单自身的属性信息,下方使用tabs控件,加入两个tab页,分别为采购明细列表(DataGrid)和审核记录列表(DataGrid),即一个主业务实体携带两个子业务实体的情况,子业务实体中datagrid采用js代码请求后台数据加载并显示。

在采购单编辑页面初始化的时候,使用tabs控件的add方法,设置Content属性为嵌入iframe

function AddSubTab(name, url) {
$("#subTabs").tabs('add', {
title: name,
content: '<iframe id="iframe" scrolling="auto" frameborder="0" src=' + url + ' style="width:100%;height:96%;"></iframe>',
closable: false,
selected: true,
cache: false
});
}

实际情况如下: 第二个tab页正常加载显示,第一个tab页中的datagrid无法显示,其他内容正常,右键选择重新加载则能正常显示 去除其中任何一个tab页,另外一个tab正常显示,颠倒顺序,结果相同,前一个tab页中的datagrid无法显示,监控后台数据,返回正常,JS无报错。

从网上搜到的 easyui 中Datagrid 控件在列较多且无数据时,列显示不全的解决方案http://www.cnblogs.com/hxling/p/3919288.html

 onLoadSuccess:function(data){
if(data.total==0){
var dc = $(this).data('datagrid').dc;
var header2Row = dc.header2.find('tr.datagrid-header-row');
dc.body2.find('table').append(header2Row.clone().css({"visibility":"hidden"})); }
}

测试有效,不过仅适用无数据情况下,把表头给显示出来,其原理也是强制显示。

此外,测试了下结构类似的系统主菜单,在快速点击功能导航树,在主区域生成多个tab页,存在datagrid同样存在无法显示的问题(点击速度足够快的情况才发生)。

从现象上看,很像是datagrid控件拿到后台json数据后,进行显示处理时被中断了,很可能是控件自身的一个BUG。

easyui的源码混淆过了,从源码上找问题难度太大,有没有清楚问题出在哪?如何解决?

最后,自己摸索出一种既能间接实现目的又简便的方法,即动态添加tab页时,设置select属性为false,这样所有的tab页都为未选中状态,最后添加一行选择函数,选中第一个tab页,这样用户看到的效果就是自动加载了第一个tab内容,正常显示出来。

easyui datagrid 诡异的无法显示问题的更多相关文章

  1. easyui datagrid 列隐藏和显示

    easyui datagrid 列隐藏和显示 用js怎么控制列的显示和隐藏?   最佳答案   $('#grid').datagrid('hideColumn','列field');把hideColu ...

  2. EasyUI DataGrid 修改每页显示数量的最大值&&导出Grid到Excel

    首先,最近在搞那个DataGrid的导出,发现,网上的用JS导出到本地的方法虽然可用,但是只能导出DataGrid当前的数据,例如说,DataGrid默认是最大显示50行,但是如果有多页,那么就无法显 ...

  3. easyui datagrid 没数据时显示滚动条的解决方法

    今天解决了一个bug,因为datagrid有多列,可是当没有数据的时候,后面的列无法通过滚动条拉动来显示,比较麻烦,而需求要求没有数据也要拉动滚动条查看后面有什么列,一开始在网上找了一些资料,发现都不 ...

  4. EasyUI datagrid列隐藏与显示

    隐藏DataGrid某一列 $("#datagrid_view").datagrid('hideColumn', filed); 2. 显示DataGrid隐藏的某一列 $(&qu ...

  5. 统计easyui datagrid某列之和显示在对应列下面

    项目需求要在表格下面加一行统计求和的,结果网上搜寻了一堆,要么说的不详细,高深大牛们的见解:要么实现不了,搜寻老半天修改出一个可以用的,做一下学习记录,新手菜鸟,欢迎指正和新解决方案. 最终效果图: ...

  6. js控制easyui datagrid列的显示和隐藏

    easyui datagrid 列隐藏和显示 $('#grid').datagrid('hideColumn','列field'); //把hideColumn换成showColumn 即为显示列

  7. EasyUI datagrid组件绑定有转义字符的json数据出错

    最近项目中一个页面的datagrid出现了莫名其妙的问题, 首先是分页数据的第二页和第三页不能展示,过了一天后第一页也出不来了, 默认首页不出来导致后续分页处理无法进行, 整个数据都不出来了,最后只能 ...

  8. easyui datagrid中datetime字段的显示和增删改查问题

    datagrid中datetime字段的异常显示: 使用过easyui datagrid的应该都知道,如果数据库中的字段是datetime类型,绑定在datagrid显式的时候会不正常显示,一般需要借 ...

  9. 实现easyui datagrid在没有数据时显示相关提示内容

    本示例实现easyui datagrid加载/查询数据时,如果没有相关记录,则在datagrid中显示没有相关记录的提示信息,效果如下图所示 本实例要实现如下图所示的效果: 本示例easyui版本为1 ...

随机推荐

  1. 【第三十一章】 elk(2)- 第二种架构(最常用架构)

    参考:http://linuxg.blog.51cto.com/4410110/1761757 最常用架构: 一.安装redis 1.下载:http://redis.io/download 2.解压后 ...

  2. 常用字符与ASCII代码对照表

    常用字符与ASCII代码对照表 为了便于查询,以下列出ASCII码表:第128-255号为扩展字符(不常用) ASCII码 键盘 ASCII 码 键盘 ASCII 码 键盘 ASCII 码 键盘 27 ...

  3. C++ 实验2:函数重载、函数模板、简单类的定义和实现

    1.函数重载编程 编写重载函数add(),实现对int型,double型,Complex型数据的加法.在main()函数中定义不同类型数据,调用测试. #include <iostream> ...

  4. WPF基础学习笔记整理 (五) DependencyObject & DependencyProperty

    参考资料: 1.http://www.cnblogs.com/Zhouyongh/archive/2009/10/20/1586278.html 基础知识: DependencyObject & ...

  5. 《Robot Framework自动化测试修炼宝典》道长

    1. Python下载https://www.python.org/downloads 2. Setuptools下载https://pypi.python.org/pypi/setuptools用原 ...

  6. Python day16 tag式整体退出技巧

    在写一些服务器时,往往会多层嵌套循环,可利用tag变量实现整体退出功能,代码: tag=True while tag: print('level1') choice=input('level1> ...

  7. 牛客练习赛7 E 珂朵莉的数列

    珂朵莉的数列 思路: 树状数组+高精度 离散化不知道哪里写错了,一直wa,最后用二分写的离散化 哪位路过大神可以帮我看看原来的那个离散化错在哪里啊 通过代码: import java.math.Big ...

  8. angular5表单验证问题

    例举一个patten的列子 可能出现的问题,表单元素需要添加name属性 还有的验证如maxlength,minlength,required等 一.验证某一个表单元素如下 *ngIf="s ...

  9. 发票查验---异步处理多条记录---demo代码

    /// 窗体加载事件        /// </summary>        /// <param name="obj"></param>   ...

  10. 『Numpy』高级函数_np.nditer()&ufunc运算

    1.np.nditer():numpy迭代器 默认情况下,nditer将视待迭代遍历的数组为只读对象(read-only),为了在遍历数组的同时,实现对数组元素值得修改,必须指定op_flags=[' ...