固定表头方法,导入框架在table里面填入数值,然后在js里面设置一定的高度

webUi
赵桐华 5 years ago
parent 2576ca9a5f
commit d7cda51631
  1. 18
      frontend/views/menu/index.php
  2. 8
      frontend/views/permissions/index.php

@ -102,24 +102,10 @@ use \common\libs\MyLib;
});
}
//使得table有一定的高度,出现滚动条
function table(){
//获取body高度
var a=$(".gray-bg").height();
//获取条件选择高度
var b=$('#searchFrm').height();
//获取标题高度
var c=$('.ibox-title').height();
//获取table高度
var e=$("#listTable").height();
var f=$(".ibox-content").height();
var d=a-c-100;
console.log(e);
console.log(f);
//$('.fixed-table-body').css({'height':d});
}
$(function() {
search();
//table设置一定的高度
var tab=$("#listTable").attr('data-height');
$('.fixed-table-body').css({'height':tab-40});
});

@ -2,6 +2,7 @@
use \common\libs\MyLib;
?>
<?php $this->beginBlock('header_css'); ?>
<link href="/assets/css/bootstrap.min.css" rel="stylesheet">
<link href="/assets/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
<?php $this->endBlock(); ?>
@ -21,7 +22,7 @@ use \common\libs\MyLib;
<div class="ibox-content">
<div class="row">
<div class="col-md-12">
<table id="listTable">
<table id="listTable" class="table table-bordered" id="table" data-toggle="table" data-height="689">
<thead class="bg-warning">
<tr>
<th data-field="id">ID</th>
@ -38,6 +39,7 @@ use \common\libs\MyLib;
<?php $this->beginBlock('footer_js'); ?>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="/assets/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
<script src="/assets/js/plugins/bootstrap-table/bootstrap-table-mobile.min.js"></script>
<script src="/assets/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
@ -98,6 +100,10 @@ use \common\libs\MyLib;
}
$(function() {
search();
//table设置一定的高度
var tab=$("#listTable").attr('data-height');
$('.fixed-table-body').css({'height':tab-40});
});
</script>
<?php $this->endBlock(); ?>

Loading…
Cancel
Save