VisualInspection/VisualInspection/view/term_management/check_terms_m.html

<!--  start -->
<div class="container-fluid ">
        <div class="row">
             <form  class="form-horizontal">
                <div class="form-group">
                    <label for="exampleInputAccount1" class="col-sm-1">关键词</label>
                    <div class="col-sm-2">
                        <input class="form-control form-focus" autofocus type="text" placeholder="请输入关键词">
                    </div>

                    <div class="col-xs-3">
                        <div class="input-group">
                            <button class="btn btn-primary " type="button">查询</button>
                        </div>
                    </div>

                     <div style="float:right;margin-right:30px;">
                        <button class="btn btn-primary" type="button" data-toggle="modal" data-target="#myModal"><i class="icon icon-plus-sign"></i> 增加班组</button>
                    </div>

                </div>
             </form>
        </div>
        <hr>
        <div class="row">
            <!-- 使用一个div来显示数据表格 -->
            <div class="datatable" data-checkable="true" data-sortable="true"></div>
        </div>
        <div class="row" style="text-align:center">
            <ul class="pager center-block">
                <li class="previous"><a href="#">« 上一页</a></li>
                <li><a href="#">1</a></li>
                <li class="active"><a href="#">2</a></li>
                <li><a href="#">3</a></li>
                <li><a href="#">4</a></li>
                <li><a href="#">5</a></li>
                <li class="next"><a href="#">下一页 »</a></li>
            </ul>
        </div>

</div>
<!--  end -->          


<script type="text/javascript">
     $(document).ready(function() {

         // 使用data参数更新数据：
        $('.datatable').datatable( {
            checkable:false,
            sortable:false,
            data: {
                cols: [
                    {width: 30, text: '序号', type: 'number', flex: false, colClass: 'text-center'},
                    {width: 160, text: '班组名称', type: 'date', flex: false, sort: 'down'},
                    {width: 80, text: '所属人员分类', type: 'string', flex: true, colClass: ''},
                    {width: 80, text: '班长', type: 'date', flex: false, sort: 'down'},
                    {width: 80, text: '副班长', type: 'string', flex: true, colClass: ''},
                    {width: 80, text: '人员', type: 'date', flex: false, sort: 'down'},
                    {width: 80, text: '操作', type: 'string', flex: true, colClass: ''},
                ],
                rows: [
                    {checked: false, data: [1, '考核一组','稽查人员','李明','李铭','王佳佳、李伟、李浩','<a href="#"><i class="icon icon-edit"></i> 修改</a> <a href="#"><i class="icon icon-remove-circle"></i> 删除</a>']},
                    {checked: false, data: [1, '考核一组','稽查人员','李明','李铭','王佳佳、李伟、李浩','<a href="#"><i class="icon icon-edit"></i> 修改</a> <a href="#"><i class="icon icon-remove-circle"></i> 删除</a>']},
                    {checked: false, data: [1, '考核一组','稽查人员','李明','李铭','王佳佳、李伟、李浩','<a href="#"><i class="icon icon-edit"></i> 修改</a> <a href="#"><i class="icon icon-remove-circle"></i> 删除</a>']},
                    {checked: false, data: [1, '考核一组','稽查人员','李明','李铭','王佳佳、李伟、李浩','<a href="#"><i class="icon icon-edit"></i> 修改</a> <a href="#"><i class="icon icon-remove-circle"></i> 删除</a>']},
                    {checked: false, data: [1, '考核一组','稽查人员','李明','李铭','王佳佳、李伟、李浩','<a href="#"><i class="icon icon-edit"></i> 修改</a> <a href="#"><i class="icon icon-remove-circle"></i> 删除</a>']},
                    {checked: false, data: [1, '考核一组','稽查人员','李明','李铭','王佳佳、李伟、李浩','<a href="#"><i class="icon icon-edit"></i> 修改</a> <a href="#"><i class="icon icon-remove-circle"></i> 删除</a>']},
                ]
            }
        });
    })
</script>