足够的不负荷

时间:2016-08-23 14:52:48

标签: javascript jquery footable

我使用插件Footable,FootablePaginate来创建一个用ajax调用创建的html表,但是我不知道什么是错的,当文档加载表时,我没有Footable选项直到我按F12,然后出现Footable的分页,但看起来像这样:

Footable

页脚错误,我将选项显示为每页显示1行,但当表格加载显示所有行时,我更改页面的时间显示确定的页数。

这是我的表:

<div class="panel-body">
    <div class="table-responsive">
        <table class="footable" id="Tabla2" data-page-size="1">
            <thead>
                <tr class="info">
                    <td>ID<span class="hidden-xs"></span></td>
                    <td>Revision<span class="hidden-xs"></span></td>
                    <td>Proposito<span class="hidden-xs"></span></td>
                    <td>OpenDate<span class="hidden-xs"></span></td>
                    <td>CloseDate<span class="hidden-xs"></span></td>
                    <td>Copias<span class="hidden-xs"></span></td>
                    <td>Estatus<span class="hidden-xs"></span></td>
                    <td>Dueño<span class="hidden-xs"></span></td>
                    <td>Modelo<span class="hidden-xs"></span></td>
                    <td>Familia<span class="hidden-xs"></span></td>
                    <td>VS<span class="hidden-xs"></span></td>
                    <td>Estacion<span class="hidden-xs"></span></td>
                    <td>FollowUp<span class="hidden-xs"></span></td>
                    <td>FollowUpNumber<span class="hidden-xs"></span></td>
                    <td><span class="fa fa-cogs"></span></td>
                </tr>
            </thead>
            <tbody id="TablaAlertas">
                <tr></tr>
            </tbody>
            <tfoot class="hide-if-no-paging">
                <tr>
                    <td colspan="5">
                        <div class="pagination pagination-centered"></div>
                    </td>
                </tr>
            </tfoot>
        </table>

    </div>
</div>

这是我的JavaScript代码,我试图将这个函数添加到我绘制表(ajax调用)的同一个JS文件中,并且我尝试在页眉中执行该函数但是得到了相同的结果。< / p>

 $(document).ready(function () {
     $('#Tabla2').footable();
 });

修改

AJAX电话:

基本上是MySQL查询(Select *),这里是js代码:

 success: function (data) {
        //Conversion de los datos obtenidos a un arreglo de JSON
        var aRC = JSON.parse(data.d);
        //Variable lineas que permitira dibujar la tabla HTML
        var lineas = "";
        //FOR para recorrer el arreglo
        for (var i = 0; i < aRC.length; i++) {
            //Variables que guardaran el dato obtenido en el arreglo
            var id = ("00000" + (parseInt(aRC[i].Id)));
            var zerofillid = id.substring(id.length - 5);
            //var id = aRC[i].Id;
            var num = zerofillid;
            var rev = aRC[i].Revision;
            var pur = aRC[i].Purpose;
            var open = aRC[i].Open;
            var close = aRC[i].Close;
            var copies = aRC[i].Copies;
            var status = aRC[i].Status;
            var owner = aRC[i].Owner;
            var mod = aRC[i].Model;
            var fam = aRC[i].Family;
            var vs = aRC[i].ValueStream;
            var sta = aRC[i].Station;
            var fu = aRC[i].Follow;
            var fun = aRC[i].FollowNumber;

            //Creacion de cada TR para cada dado obtenido
            lineas += '<tr id="P' + zerofillid + '" data-id="' + zerofillid + '">';
            //lineas += '<td id="P' + id + '-1">' + aRC[i].Id + '</td>'
            lineas += '<td>' + num + '</td>';
            lineas += '<td id="P' + zerofillid + '-1">' + rev + '</td>';
            lineas += '<td id="P' + zerofillid + '-2">' + pur + '</td>';
            lineas += '<td id="P' + zerofillid + '-3">' + open + '</td>';
            lineas += '<td id="P' + zerofillid + '-4">' + close + '</td>';
            lineas += '<td id="P' + zerofillid + '-5">' + copies + '</td>';
            lineas += '<td id="P' + zerofillid + '-6">' + status + '</td>';
            lineas += '<td id="P' + zerofillid + '-7">' + owner + '</td>';
            lineas += '<td id="P' + zerofillid + '-8">' + mod + '</td>';
            lineas += '<td id="P' + zerofillid + '-9">' + fam + '</td>';
            lineas += '<td id="P' + zerofillid + '-10">' + vs + '</td>';
            lineas += '<td id="P' + zerofillid + '-11">' + sta + '</td>';
            lineas += '<td id="P' + zerofillid + '-12">' + fu + '</td>';
            lineas += '<td id="P' + zerofillid + '-13">' + fun + '</td>';
            lineas += '<td>';
            //Botones de accion
            lineas += '   <span class="btn btn-success btn-xs glyphicon glyphicon-edit" data-id="' + zerofillid + '"></span>';
            lineas += ' </td>';

            lineas += '</tr>';


        }
        //Id de donde se dibujara la variable lineas
        $('#TablaAlertas').html(lineas);
    }

编辑2:

当我重新调整窗口大小时,该表也可以使用

0 个答案:

没有答案