当切换tab时,数据加载了,但是table的宽和高不能不能够初始化。

郁闷了好久解决了这个问题:

在页面加载时和切换tab时,获取当前tab的名字,进行内容的初始化

$('a[name="mainTab"]').on('shown.bs.tab', function(e) {
  // 获取已激活的标签页的名称
  selectTabName = $(e.target).text();
  selectTab(selectTabName);
});

 

//根据标签页刷新页面
function selectTab(selectTabName){
if(selectTabName == '设备统计'){
//设备统计列表
initDeviceCountTable();
}else if(selectTabName == '与LLDP对比'){
//对比表
initCompareTable();
}
}

  

<ul class="nav nav-tabs">
<li class="active">
  <a href="#manage" data-toggle="tab" name="mainTab">设备管理</a>
</li>
<li >
  <a href="#count" data-toggle="tab" name="mainTab">设备统计</a>
</li>
<li >
  <a href="#compare" data-toggle="tab" name="mainTab">与LLDP对比</a>
</li>
</ul> <div class="tab-content" id="mytabContent">
  <div class="tab-pane fade in active " id="manage">
    <!--设备管理的内容-->
    <%@include file="deviceManage.jsp"%>
  </div>
  <div class="tab-pane fade " id="count">
    <!-- 设备统计列表 --> 
    <%@include file="deviceCount.jsp"%>
  </div>
  <div class="tab-pane fade" id="compare"> 
    <!-- 与LLDP对比列表-->
    <%@include file="deviceCompare.jsp"%>
  </div>
</div>

  

  

在使用easyui datagrid在tab中遇到的问题的更多相关文章

  1. EasyUI datagrid 明细表格中编辑框 事件绑定 及灵活计算 可根据此思路 扩展其他

    原创 : EasyUI datagrid 明细表格中编辑框 事件绑定 及灵活计算 可根据此思路 扩展其他 转载,请注明出处哦!谢谢! 原创 : EasyUI datagrid 明细表格中编辑框 事件绑 ...

  2. 在使用easyui,datagrid时,JSON中的如果含有换行符,则不能显示数据

    http://www.xuebuyuan.com/2103538.html 每项值需处理换行符 item = item.Replace("\r\n", ""); ...

  3. easyui在当前tab中直接加载url

    var tab = $('#mainTabs').tabs('getSelected'); // get selected panel $('#mainTabs').tabs('update', { ...

  4. easyui datagrid行编辑中数据联动

    easyui的datagrid中行内编辑使用数据联动.即:当编辑产品编号时,该行的产品名称自动根据产品编号显示出来. 在编辑中获取当前行的索引 function getRowIndex(target) ...

  5. jQuery EasyUI DataGrid在MVC中的运用-基本属性并实现分页

    ※ datagrid的基本属性和方法  ※ datagrid分页在前后台的实现 最终效果:    与视图显示对应的view model   public class Book public strin ...

  6. easyui datagrid标题列宽度自适应

    最近项目中使用easyui做前端界面,相信大部分使用过easyui datagrid的朋友有这么一个疑问:如果在columns中不设置width属性能不能写个方法让datagrid的头部标题和数据主体 ...

  7. easyui datagrid中 多表头方法总结

    easyui datagrid中怎么设置表头成多行显示呢?其实很简单,就是给datagrid的columns属性设置成多个数组就行了.下面直接看例子吧,这是一个两行表头的,按照此方法,还可以设置三行表 ...

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

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

  9. EasyUI Datagrid 分页的情况下实现点击表头的小三角图标对数据库中所有数据重新排序

    说明一下: 当点击 datagrid 表头某一列的小三角图标时,easyui 本身是有排序的,但是在当我们对 datagrid 进行了分页的情况下,点击排序只是对当前页的数据进行排序,而需求需要我对数 ...

随机推荐

  1. Ajax技术实战操练课堂学习笔记

    ajax是什么 ? ajax(asynchronouse javascript and xml) 异步的javascript 和 xml 是7种技术的综合,它包含了七个技术( javascript x ...

  2. [luogu2052 NOI2011] 道路修建 (树形dp)

    传送门 Description 在 W 星球上有 n 个国家.为了各自国家的经济发展,他们决定在各个国家 之间建设双向道路使得国家之间连通.但是每个国家的国王都很吝啬,他们只愿 意修建恰好 n – 1 ...

  3. php中的form表单

    表单处理 表单的概念在生活中很常见,就像是问卷调查表一样,别人先把问卷发给你,你照着问卷的要求填写,完事过后再将填完的问卷发给别人,从而达到一个将别人需要的信息传递给别人的一种方式. 传统的网页大多数 ...

  4. 【Manthan, Codefest 18 (rated, Div. 1 + Div. 2) C】Equalize

    [链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] Swap操作显然只能对(i-1,i)执行才有用. 不然直接将i翻转以及j翻转 显然比直接交换更优. 那么现在我们就相当于有两种操作. ...

  5. hdu 2435 dinic算法模板+最小割性质

    #include<stdio.h> #include<queue> #include<string.h> using namespace std; #define ...

  6. poi读取合并单元格

    poi读取合并单元格 学习了:http://blog.csdn.net/ycb1689/article/details/9764191 进行了列合并单元格的修正:原来是我自己找错了地方: import ...

  7. Linux系统编程——多线程实现多任务

    概述 每一个进程都拥有自己的数据段.代码段和堆栈段.这就造成进程在进行创建.切换.撤销操作时,须要较大的系统开销. 为了降低系统开销,从进程中演化出了线程.为了让进程完毕一定的工作.进程必须至少包括一 ...

  8. @Autowired 凝视遇到的问题,@Qualifier 帮助解决这个问题

    当候选 Bean 数目不为 1 时的应对方法 在默认情况下使用 @Autowired 凝视进行自己主动注入时,Spring 容器中匹配的候选 Bean 数目必须有且仅有一个. 当找不到一个匹配的 Be ...

  9. 具体图解 Flume介绍、安装配置

    写在前面一: 本文总结"Hadoop生态系统"中的当中一员--Apache Flume 写在前面二: 所用软件说明: 一.什么是Apache Flume 官网:Flume is a ...

  10. Android自己定义View之组合控件 ---- LED数字时钟

    先上图 LEDView效果如图所看到的. 之前看到一篇博客使用两个TextView实现了该效果.于是我想用自己定义控件的方式实现一个LEDView.使用时就可以直接使用该控件. 採用组合控件的方式,将 ...