当切换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. 日常记录-Pandas Cookbook

    Cookbook 1.更新内容 2.关于安装 3.Pandas使用注意事项 4.包环境 5.10分钟Pandas初识 6.教程 7.Cookbook 8.数据结构简介 9.基本功能 10.使用文本数据 ...

  2. python中的and、or 操作符

    在python中 非空 非零的数都为真 1. 其"and"操作符返回的结果是决定表达式结果的值:两边条件都为真则结果为真,有一假则为假 1) 当and两边条件为“真”时,返回的是a ...

  3. 酒店管理系统(功能结构图、E-R图、用例图)

    功能结构图 用例图 状态图 流程图 数据字典 er图

  4. 【hiho一下 第九周】 状态压缩·二

    [题目链接]:http://hihocoder.com/problemset/problem/1048 [题意] [题解] 按从左到右然后从上到下的顺序; 依次枚举每个格子是竖条还是横条; 然后在搜索 ...

  5. CentOS中防火墙相关的命令(CentOS7中演示)

    CentOS中防火墙程序主要是firewall和iptables,CentOS7中firewall服务已经默认安装好了,而iptables服务需要自己用yum  install  iptabes-se ...

  6. 启动 Appium 自带模拟器

    1.先在sclipse中新建并打开一个设备 2.启动appium 3.安装apk 打开cmd  并在sdk安装目录的tools文件夹下输入安装命令adb install xxx.apk(在这之前需要把 ...

  7. ZOJ 3888 Twelves Monkeys

    Twelves Monkeys Time Limit: 5000ms Memory Limit: 32768KB This problem will be judged on ZJU. Origina ...

  8. query ajax总是进入error回调函数

    query ajax总是进入error回调函数今天纠结了1小时,ajax总是进入了error函数中.平时使用从来没有出现过这种现象,纠结了半小时. 最后稍微总结出了点: 1.以前使用都是服务器端输出S ...

  9. 基于mybatis的CRUD

    u  基于Mybatis的CRUD u  掌握MyBatis的结果类型-resultMap和resultType u  掌握MyBatis的参数类型 u  掌握#和$两种语法 1      基于myb ...

  10. MSMQ如何设置事务特性