如果配置datables加载数据的时候显示进度条呢?
如下图所示效果:
这个功能采用模态框实现,弹出模态框和关闭模态框
HTML代码:(随便放在一个位置,因为是隐藏的)
<%--等待加载数据滚动条模态框--%> <div class="modal fade" id="loadingModal"> <div style="width: 200px;height:20px; z-index: 20000; position: absolute; text-align: center; left: 50%; top: 50%;margin-left:-100px;margin-top:-100px"> <div class="progress progress-striped active" style="margin-bottom: 0;"> <div class="progress-bar" style="width: 100%;"></div> </div> <h5 style="color:black"> <strong>正在加载...请稍等!</strong> </h5> </div> </div>
何时显示模态框(动态的进度条)呢
初始化datables的时候显示这个模态框
代码如下:
//显示加载数据的进度条 $("#loadingModal").modal('show');
何时关闭模态框呢?
初始化datbales的时候关闭模态框
var table = $('#taaa').dataTable({ initComplete: function(settings, json) { //当datables初始化完毕时 //关闭加载数据的等待进度条 $('#loadingModal').modal('hide'); } })