查看: 7806|回复: 10

datagrid显示错乱 [复制链接]

wangy

注册会员

Rank: 2

电梯直达

楼主

发表于 2017-6-12 10:49:15 |只看该作者 |倒序浏览

附件: 你需要登录才可以下载或查看附件。没有帐号？立即注册

收藏0

wangy

注册会员

Rank: 2

沙发

发表于 2017-6-12 10:50:49 |只看该作者

我这是一个tab页，当点击tab页切换过来的时候显示的表格向上面那样出BUG，但是按F11后会恢复正常

dforce

超级版主

Rank: 8 Rank: 8

板凳

发表于 2017-6-12 10:56:40 |只看该作者

wangy 发表于 2017-6-12 10:50
我这是一个tab页，当点击tab页切换过来的时候显示的表格向上面那样出BUG，但是按F11后会恢复正常 ...

把这个表格页面代码打包发上来，我们测试一下
另外说明一下出现这问题的环境

wangy

注册会员

Rank: 2

地板

发表于 2017-6-12 11:34:21 |只看该作者

dforce 发表于 2017-6-12 10:56
把这个表格页面代码打包发上来，我们测试一下
另外说明一下出现这问题的环境 ...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>Fit Layout</title>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8" /><link href="../demo.css" rel="stylesheet" type="text/css" />

  <script src="../../scripts/boot.js" type="text/javascript"></script>

</head>
<body >
<style type="text/css">
  html, body{
margin:0;padding:0;border:0;width:100%;height:100%;overflow:hidden;
  }
  .tab-pane{
display: none;
  }
  .tab-pane.active{
display: block;
  }
</style>

<ul class="nav-tabs">
  <li><a href="#div1">div1</a></li>
  <li><a href="#div2">div2</a></li>
</ul>
<div>
  <div class="tab-pane active" id="div1">
111111111111
  </div>
  
  <div class="tab-pane" id="div2" style="height:500px">
<div class="mini-fit" >

   <div id="datagrid1" class="mini-datagrid" style="width:100%;height:100%;"
         url="../data/AjaxService.jsp?method=SearchEmployees"  idField="id"
         sizeList="[5,10,20,50]" pageSize="10"
      >
      <div property="columns">
      <div type="indexcolumn" ></div>
      <div field="loginname" width="120" headerAlign="center" allowSort="true">员工帐号</div>
      <div field="name" width="120" headerAlign="center" allowSort="true">姓名</div>
      <div field="gender" width="100" renderer="onGenderRenderer" align="center" headerAlign="center">性别</div>
      <div field="salary" width="100" allowSort="true">薪资</div>
      <div field="age" width="100" allowSort="true">年龄</div>
      <div field="createtime" width="100" headerAlign="center" dateFormat="yyyy-MM-dd" allowSort="true">创建日期</div>
      </div>
   </div>

</div>
  </div>
</div>

<script type="text/javascript">
  mini.parse();
  var grid = mini.get("datagrid1");
  grid.load();
  grid.setVisible(true)

  function onSearch() {
mini.open({
   url: bootPATH + "../demo/CommonLibs/SelectGridWindow.html"
});
  }
  $(".nav-tabs").on("click","a",function(e){
var e=e|| window.event;
if (e.preventDefault) {
   e.preventDefault();
   e.stopPropagation();
} else {
   e.returnValue = false;
   e.cancelBubble = true;
}
var id=$(this).attr("href");
$(id).addClass("active").siblings().removeClass("Active")
  })
</script>

</body>
</html>