Quiero hacer la tabla como tabla de datos pero no se aplica en mi tabla. datatable funciona en una tabla estática, pero al agregar una tabla dinámica no muestra ninguna función de tabla de datos, como la opción de búsqueda y la paginación. todos los registros que se muestran en el momento a pesar de que se seleccionó 10 en la paginación.

Código

   <script>
            $(document).ready(function () {
                $('#example').DataTable();
            });
        </script>


    <table id="example" class="display" width="100%" cellspacing="0">
    <thead>
        <tr>
            <th>deviceid</th>
            <th>status</th>
            <th>UpdatedTime</th>
        </tr>
    </thead>
    <tfoot>
        <tr>
            <th>deviceid</th>
            <th>status</th>
            <th>UpdatedTime</th>
        </tr>
    </tfoot>

@foreach (var item in Model)
{
    <tbody>
        <tr>
            <td>@Html.DisplayFor(modelItem => item.deviceid)</td>
            <td>@Html.DisplayFor(modelItem => item.status)</td>
            <td>@Html.DisplayFor(modelItem => item.UpdatedTime)</td>
        </tr>
    </tbody>
}
</table>
0
rahul kumar 18 oct. 2017 a las 13:34

3 respuestas

La mejor respuesta

agrega todo lo siguiente

//cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css
//cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.min.js
//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js
//cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js

Ejemplo de enlace : https://jsfiddle.net/r8gd2227/3/

0
muhammet talha şahin 18 oct. 2017 a las 18:54

Pruebe esto:

$(document).ready(function () {
            $('#example').DataTable();
        });
0
muhammet talha şahin 18 oct. 2017 a las 11:45
<table id="example" class="display" width="100%" cellspacing="0">
    <thead>
        <tr>
            <th>deviceid</th>
            <th>status</th>
            <th>UpdatedTime</th>
        </tr>
    </thead>
    <tfoot>
        <tr>
            <th>deviceid</th>
            <th>status</th>
            <th>UpdatedTime</th>
        </tr>
    </tfoot>

    <tbody>
@foreach (var item in Model)
{
         <tr >
            <td>@Html.DisplayFor(modelItem => item.deviceid)</td>
            <td>@Html.DisplayFor(modelItem => item.status)</td>
            <td>@Html.DisplayFor(modelItem => item.UpdatedTime)</td>
        </tr>
}
    </tbody>
</table>
0
rahul kumar 18 oct. 2017 a las 12:04