DataTables shows data but everything else doesn't work

DataTables shows data but everything else doesn't work

FxabricioFxabricio Posts: 2Questions: 1Answers: 0
edited October 2022 in Free community support

For example when I click on the name field it does not sort from a-z, likewise with Client id, it does not sort from the highest number to the smallest, same with the other columns, also at the bottom it shows this Showing 1 to 1 of 1 entries when there are 25.

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
    <%@page import="java.util.List"%>
<%@page import="entidad.Cliente"%>
<!doctype html>
<html lang="en">

 

  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<!--    Datatables  -->
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/jq-3.6.0/dt-1.12.1/datatables.min.css"/>
   
    <title></title>
  </head>
  <body>
  <%
        List<Cliente> da = (List<Cliente>) request.getAttribute("data");
    %>
    <h3>Datatables</h3>
    <h4>Ejemplo Datatables estilo Base</h4>
    
    <table id="example" class="display" style="width:100%">
        <thead>
            <tr>
                <th>idCliente</th>
            <th>Nombre</th>
            <th>Apellido</th>
            <th>Correo</th>
            <th>Numero</th>
            <th>Edad</th>
            <th>Genero</th>
            </tr>
        </thead>
        <%
            if (da != null) {
            for (Cliente a : da) {
        %>
        <tbody>
        <tr>
            <td><%=a.getIdCliente()%></td>
            <td><%=a.getNombreCliente()%></td>
            <td><%=a.getApellidoCliente()%></td>
            <td><%=a.getCorreoCliente()%></td>
            <td><%=a.getNumeroCliente()%></td>
            <td><%=a.getEdadCliente()%></td>
            <td><%=a.getGeneroCliente()%></td>
        </tr>
        <%
            }
        }
        %>
            </tbody>
    </table>

      <!-- Optional JavaScript -->
    <script src="https://code.jquery.com/jquery-3.3.1.js"></script>
    
      
    <!--    Datatables-->
    
    <script type="text/javascript" src="https://cdn.datatables.net/v/dt/jq-3.6.0/dt-1.12.1/datatables.min.js"></script>
      
    <script>
    $(document).ready(function() {
        $('#example').DataTable();
    } );  
    </script>
      
      
  </body>
</html>

Attached screenshot

https://prnt.sc/THDyuUngLr-P

This question has an accepted answers - jump to answer

Answers

  • kthorngrenkthorngren Posts: 21,343Questions: 26Answers: 4,954
    Answer ✓

    You have the tbody inside the loop. Datatables supports only one tbody so its only picking up the first row in the first tbody. Move line 43 between 38 and 39. I think this should fix it.

    Kevin

  • FxabricioFxabricio Posts: 2Questions: 1Answers: 0

    Yes, you're right, that's how it works. Thank you very much. :)

Sign In or Register to comment.