Introducción

Hola,
el objetivo de este blog es mostrar cómo puede implementar tablas completamente
funcionales y de alto rendimiento utilizando el complemento jQuery DataTables .
Básicamente, hay muchas maneras de obtener sus datos en DataTables, y si está trabajando
con grandes bases de datos, es posible que desee considerar el uso de las opciones del lado del
servidor que proporciona DataTables. Básicamente, todo el filtrado, paginación, clasificación,
cambio de longitud de página, etc. y DataTables es solo un módulo de eventos y
visualización. Las dos formas preferidas para el procesamiento de JQuery Datatable son el
procesamiento del lado del cliente y el procesamiento del lado del servidor . Este es un
complemento de JavaScript implementado utilizando la biblioteca jQuery que maneja toda la
interacción necesaria con el usuario en el lado del cliente. Entonces, aquí se me ocurrió un blog
para jQuery Datatable porque me gustó mucho este control. Este artículo muestra cómo
el complemento jQuery DataTablesSe puede integrar en aplicaciones web Java.
Este ejemplo muestra cómo puede generar una tabla de estudiantes y agregar el
complemento jQuery DataTables a la tabla HTML. En ese caso, Todo se implementa utilizando
funcionalidades de JavaScript, por lo que no necesita hacer nada más. Lo único que debe hacer
es generar una tabla simple como en el caso inicial. La nueva tabla mejorada se muestra en la
siguiente figura:

Usando el código
Este ejemplo muestra cómo puede generar una tabla de Estudiantes y agregar el complemento
jQuery DataTables a la tabla HTML. El código está organizado lógicamente en la estructura
MVC:
1. El modelo representa clases que contienen datos y que se mostrarán en el navegador.
2. Las vistas son páginas que se utilizan para mostrar datos al cliente; en este ejemplo, se
utilizan como vistas un JSP y una página HTML sin formato.
3. El controlador es la lógica de la aplicación y representa los servlets que manejan las
solicitudes web y las funciones de utilidad.
También hay un paquete de utilidades que contiene clases que transforman objetos Java en
JSON (esto es necesario porque el complemento jQuery DataTables se comunica con el código
del lado del servidor a través de objetos JSON pero no es necesario para el lado del cliente) y lo
estamos usando tanto con el cliente como con el lado y lado del servidor.
El Modelo es una clase de Estudiante que contiene las siguientes propiedades:

1. Id del Estudiante
2. Nombre del Estudiante
3. Género
4. Dirección
5. Grado

En este ejemplo, he usado una base de datos MYSQL llamada MyDB (para crear el comando de
la base de datos y la tabla de estudiantes, he adjuntado el archivo studentDB.sql. Utilice este
archivo para la creación de la base de datos y la tabla de estudiantes), así que he usado una
clase llamada StudentModel ( POJO) que contiene un setter-getter para los parámetros de
estudiante anteriores de la siguiente manera:

StudentModel.java
package com;

public class StudentModel {

private long sttudentId;

private String firstName;
private String lastName;
private String address;
private String gender;
private String grade;

public long getSttudentId() {

return sttudentId;
}

public void setSttudentId(long sttudentId) {

this.sttudentId = sttudentId;
}

public String getFirstName() {

return firstName;
}

public void setFirstName(String firstName) {

this.firstName = firstName;
}

public String getLastName() {

return lastName;
}
public void setLastName(String lastName) {
this.lastName = lastName;
}

public String getAddress() {

return address;
}

public void setAddress(String address) {

this.address = address;
}

public String getGender() {

return gender;
}

public void setGender(String gender) {

this.gender = gender;
}

public String getGrade() {

return grade;
}

public void setGrade(String grade) {

this.grade = grade;
}

Las siguientes secciones se presentan con dos casos principales de uso de DataTables en
aplicaciones web Java.

A) Modo de procesamiento del lado del cliente (uso predeterminado)

En este modo predeterminado, se requiere una cantidad mínima de código: el servidor web
puede generar una tabla HTML simple en formato estándar. El componente de JavaScript del
lado del cliente utilizará lo que se genere y agregará funcionalidades del lado del cliente. En
este modo del lado del cliente, DataTables toma todas las filas de la tabla del
<tbody></tbody>
y realiza el filtrado, la paginación y la clasificación directamente en estos elementos como con
los objetos en memoria. Esta es la forma más rápida de usar DataTables, pero requiere que el
servidor devuelva todos los datos en una sola llamada, cargue todas estas filas como objetos
de JavaScript en memoria y las represente dinámicamente en DOM. Esto podría causar
problemas de rendimiento con la llamada del servidor y el uso de la memoria en el cliente.  Sin
embargo, esto minimiza la cantidad de solicitudes enviadas al servidor porque una vez que se
carga la tabla, el servidor no se usa en absoluto.
Este es el pequeño código que he generado para que se implemente Jquery Datatable:
1) tabla-demo.js
var studentTable;

jQuery(document).ready(function() {

studentTable = jQuery(&#039;#studentListTable&#039;).dataTable({
"bJQueryUI" : true,
"sPaginationType" : "full_numbers",
"bRetrieve" : true,
"bFilter" : true,
"iDisplayLength": 10,
"bProcessing" : true,
"bServerSide" : false,
"aoColumns" : [ { "bSearchable" : false,"bVisible" : false,
"asSorting" : [ "asc" ] },
{"sWidth" : "20%","bSortable" : true },
{"sWidth" : "20%","bSortable" : true },
{"sWidth" : "20%","bSortable" : true },
{"sWidth" : "20%","bSortable" : true },
{"sWidth" : "20%","bSortable" : true }
]
});

jQuery(".ui-corner-br").addClass(&#039;ui-widget-header_custom &#039;);
});

En el controlador de eventos de JavaScript listo para documentos, la tabla generada sin

formato se mejora con el complemento jQuery DataTables. Hay parámetros que se pasan a la
función de inicialización del complemento (estos son parámetros que siempre uso):

1. sPagination: indica al complemento que genere paginación con números en lugar de dos
botones anterior-siguiente, como se genera de forma predeterminada.
2. bJQueryUI: aplicación de estilos jQueryUI estándar.
3. sajaxSource: puede indicar a DataTables que cargue datos desde una fuente externa usando
este parámetro (use aData si desea pasar datos que ya tiene). Simplemente proporcione una
URL desde la que se pueda obtener un objeto JSON. Este objeto debe incluir el parámetro
'aaData', que es la fuente de datos de la tabla.
4. bRetrieve: recupera el objeto DataTables para el selector dado.
5. bProcesando: habilite o deshabilite la visualización de un indicador de 'procesamiento'
cuando la tabla se está procesando.
6. bServerSide: configure DataTables para usar el procesamiento del lado del servidor. Tenga
en cuenta que también se debe proporcionar el parámetro sAjaxSource para dar a DataTables
una fuente para obtener los datos requeridos para cada sorteo.
7. aoColumns: esta matriz le permite apuntar a una columna específica, varias columnas o
todas las columnas, utilizando la propiedad aTargets de cada objeto en la matriz.
8. bsortable: habilite o deshabilite la clasificación en esta columna.
9. sWidth- Definición del ancho de la columna.
10. bSearchable: habilite o deshabilite el filtrado de los datos en esta columna.
11. bVisible: activa o desactiva la visualización de esta columna.
12. clasificación: puede controlar la dirección de clasificación predeterminada e incluso alterar
el comportamiento del controlador de clasificación (es decir, solo una clasificación ascendente
lenta, etc.) usando este parámetro.
Como se mencionó anteriormente, el complemento jQuery DataTables se puede aplicar en una
estructura HTML estática en el navegador. He generado una estructura de tabla usando una
página JSP para hacer una llamada a table-demo.js arriba que se muestra en la lista a
continuación:

2) tabla-demo.jsp
<%@ page
import="com.*,java.util.*"%><!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript">
var basePath = &#039;${pageContext.request.contextPath}&#039;;
</script>
<link type="text/css" rel="stylesheet" media="all"
href="${pageContext.request.contextPath}/assets/datatable/css/demo_table_jui.css" >
<link type="text/css" rel="stylesheet" media="all"
href="${pageContext.request.contextPath}/assets/jquery-ui/css/redmond/jquery-ui-1.8.11.custom.css" >
<script type="text/javascript" src="${pageContext.request.contextPath}/assets/js/jquery-1.5.2.min.js"
></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/assets/js/jquery-ajax-form-
plugin/jquery.form.js" ></script>
<script type="text/javascript"
src="${pageContext.request.contextPath}/assets/datatable/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/assets/jquery-ui/js/jquery-ui-
1.8.11.custom.min.js" ></script>

<script type="text/javascript" src="${pageContext.request.contextPath}/assets/js/table-demo.js"></script>

<title>Student Form</title>
</head>
<body>
<form>
<div class="titleDiv">Student List</div>
<div class="clearfix"></div>
<div class="formDiv">
<table border="0" margin="0" padding="0" width="100%"
class="dataTables_wrapper" id="studentListTable">
<thead>
<tr>
<th>Id</th>
<th>First Name</th>
<th>Last Name</th>
<th>Gender</th>
<th>Address</th>
<th>Grade</th>
</tr>
</thead>
<tbody>
<%
if(request.getAttribute("studentList") != null){
List<StudentModel> studentList = (List<StudentModel>)
request.getAttribute("studentList");
%>
<%
if( studentList != null ){
for (StudentModel student: studentList){
%>
<tr>
<td><%=student.getSttudentId()%></td>
<td><%=student.getFirstName()%></td>
<td><%=student.getLastName()%></td>
<td><%=student.getGender()%></td>
<td><%=student.getAddress()%></td>
<td><%=student.getGrade()%></td>

</tr>
<%}
}

}%>

</tbody>
</table>
</div>
</form>
</body>
</html>

En esta página JSP se incluyen todas las bibliotecas de JavaScript necesarias y se genera el
código HTML para la tabla de estudiantes. Para fines de demostración, un bucle simple genera
un TR para cada estudiante que devuelve la clase TableDemoAction. Sin embargo, en sus
aplicaciones, puede usar cualquier procesamiento del lado del servidor que desee (JavaBeans,
componentes JSTL, etc.) porque el complemento jQuery DataTables es independiente de la
tecnología del lado del servidor aplicada.
Esta es mi clase de acción (controlador) llamada TableDemoAction que hace una llamada a la
lista de estudiantes que a su vez devuelve la lista de estudiantes. También reenvíe la solicitud a
la página JSP table-demo.jsp.

3) TableDemoAction.java
package com;

import java.io.IOException;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;
import java.util.ArrayList;
import java.util.List;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@SuppressWarnings("serial")
public class TableDemoAction extends HttpServlet {

private String STUDENT_ID_LIST = "studentList";

public void doGet(HttpServletRequest request, HttpServletResponse response)throws ServletException,

IOException {

List<StudentModel> studentList = null;

try {
studentList = selectStudentInfo();
} catch (SQLException e) {
e.printStackTrace();
}

String destination = "/WEB-INF/views/com/table-demo.jsp";

request.setAttribute(STUDENT_ID_LIST, studentList);

RequestDispatcher rd = request.getRequestDispatcher(destination);
rd.forward(request, response);

public List<StudentModel> selectStudentInfo() throws SQLException {

List<StudentModel> al = new ArrayList<StudentModel>();

// @formatter:off

String query = " SELECT id,firstName,lastName,gender,address,grade " +

" FROM student order by id asc ";

// @formatter:on
String connectionURL = "jdbc:mysql://localhost:3306/MyDB?
user=root&password=mobisoft";
try {
Class.forName("com.mysql.jdbc.Driver");
} catch (ClassNotFoundException e) {
e.printStackTrace();
}

Connection connection = DriverManager.getConnection(connectionURL);

Statement statement = connection.createStatement();
ResultSet resultSet = statement.executeQuery(query);
while (resultSet.next()) {

StudentModel student = new StudentModel();

student.setSttudentId(resultSet.getLong("id"));
student.setFirstName(resultSet.getString("firstName"));
student.setLastName(resultSet.getString("lastName"));
student.setGender(resultSet.getString("gender"));
student.setAddress(resultSet.getString("address"));
student.setGrade(resultSet.getString("grade"));

al.add(student);
}

resultSet.close();
statement.close();

return al;
}
}

En lugar de la tabla HTML simple, el siguiente componente se muestra en el lado del cliente:

Todas las acciones que ve en el componente se implementan en el lado del cliente (por
ejemplo, cuando ingresa texto en el cuadro de texto, se filtran los elementos TR). Esta es la
forma más rápida para el usuario, bajo el supuesto de que el tiempo necesario para cargar la
tabla no es demasiado grande. Si tiene una gran cantidad de datos, podría considerar usar
DataTables en modo AJAX donde solo se devuelven resultados parciales al complemento.
Puede ver una lista completa de complementos de DataTable adicionales en el sitio de
DataTables. Todos estos complementos son complementos adicionales para DataTables, pero
también puede usar la potente API de DataTables para personalizar el comportamiento. En la
siguiente figura se muestra un ejemplo de la tabla simple mejorada con algunos complementos
mencionados:
Si tiene una cantidad razonable de registros en la tabla, no necesita preocuparse por estas
funcionalidades. Simplemente represente una tabla simple y aplique alguna combinación de
complementos que necesite.
Sin embargo, si tiene muchos registros que se muestran en la tabla y desea evitar el
procesamiento complejo de JavaScript en el navegador, puede implementar la lógica de
procesamiento en el lado del servidor (por ejemplo, en algún servlet) y configurar DataTables
para consulta al servidor a través de llamadas AJAX para obtener información que debe
mostrarse. Este modo se describe en la siguiente sección.

B) Jquery Datatable con procesamiento del lado del servidor

El complemento jQuery DataTables es un excelente componente del lado del cliente que se
puede usar para crear tablas ricas en funciones en un navegador web. Este complemento
agrega muchas funcionalidades a las tablas HTML simples. Aunque, de forma predeterminada,
es del lado del cliente puro, puede configurarse para usar datos del servidor a través de
llamadas AJAX para mejorar el rendimiento. Sin embargo, para integrar DataTables con el
código del lado del servidor, el desarrollador debe conocer los protocolos y parámetros que
envía DataTables y cómo usarlos en el lado del servidor.
En este modo, en lugar de tomar la página completa a la vez, se envían varias solicitudes más
pequeñas cada vez que se requiere nueva información y el servidor devuelve una cantidad
mínima de datos. Este ejemplo llama a la URL /DatatableDemoAction y envía información
sobre el estudiante.
Comencemos con Jquery:
esta es la pequeña cantidad de código que he generado para que se implemente Jquery
Datatable con procesamiento del lado del servidor:

1) datatable-demo.js
var studentTable;

jQuery(document).ready(function() {

studentTable = jQuery(&#039;#studentListTable&#039;).dataTable({

"bJQueryUI" : true,
"sPaginationType" : "full_numbers",
"iDisplayLength": 10,
"bProcessing" : true,
"bServerSide" : true,
"sAjaxSource" : basePath +"/com/DatatableDemoAction.java",

"aoColumns" : [{"bSearchable" : false, "bVisible" : false, "asSorting" : [ "asc" ] },

{"sWidth" : "20%","bSortable" : true },
{"sWidth" : "20%","bSortable" : true },
{"sWidth" : "10%","bSortable" : true },
{"sWidth" : "20%","bSortable" : true },
{"sWidth" : "20%","bSortable" : true }
]
});
jQuery(".ui-corner-br").addClass(&#039;ui-widget-header_custom &#039;);
});

En el controlador de eventos de JavaScript listo para documentos, la tabla generada sin

formato se mejora con el complemento jQuery DataTables. Los parámetros que se pasan a la
función de inicialización del complemento que ya he discutido anteriormente, el único
parámetro que me gustaría decirle es:
1. bServerSide: configure DataTables para usar el procesamiento del lado del servidor. Tenga
en cuenta que también se debe proporcionar el parámetro sAjaxSource para dar a DataTables
una fuente para obtener los datos requeridos para cada sorteo. Debe ser cierto para el
procesamiento del lado del servidor.
Como se mencionó anteriormente, el complemento jQuery DataTables se puede aplicar en una
estructura HTML estática en el navegador. Generé una estructura de tabla usando una página
JSP para hacer una llamada a datatable-demo.js anterior que se muestra en la lista a
continuación:

2) datatable-demo.jsp
<%@ page
import="java.util.*"%><!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript">
var basePath = &#039;${pageContext.request.contextPath}&#039;;
</script>
<link type="text/css" rel="stylesheet" media="all"
href="${pageContext.request.contextPath}/assets/datatable/css/demo_table_jui.css" >
<link type="text/css" rel="stylesheet" media="all"
href="${pageContext.request.contextPath}/assets/jquery-ui/css/redmond/jquery-ui-1.8.11.custom.css" >
<script type="text/javascript" src=" $pageContext.request.contextPath}/assets/js/jquery-1.5.2.min.js"
></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/assets/js/jquery-ajax-form-
plugin/jquery.form.js" ></script>
<script type="text/javascript"
src="${pageContext.request.contextPath}/assets/datatable/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/assets/jquery-ui/js/jquery-ui-
1.8.11.custom.min.js" ></script>

<script type="text/javascript" src="${pageContext.request.contextPath}/assets/js/datatable-demo.js"></

script>

<title>Student Form</title>
</head>
<body>
<form>
<div class="titleDiv">Student List</div>
<div class="clearfix"></div>

<div class="formDiv">
<table border="0" margin="0" padding="0" width="100%"
class="dataTables_wrapper" id="studentListTable">
<thead>
<tr>
<th>Id</th>
<th>First Name</th>
<th>Last Name</th>
<th>Gender</th>
<th>Address</th>
<th>Grade</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</form>
</body>
</html>

En esta página JSP se incluyen todas las bibliotecas de JavaScript necesarias y el código HTML
para generar la tabla de estudiantes. Para fines de demostración, he utilizado el procesamiento
del lado del servidor porque el complemento jQuery DataTables es independiente de la
tecnología del lado del servidor aplicada.
En el tercer paso, hemos creado la clase DemoAction.java que realiza una llamada a la página
JSP ( datatable-demo.jsp ) que a su vez llama al archivo JS ( datatable-demo.js ) y este JS a su
vez realiza una llamada a DatatableDemoAction. Java.

3) DemoAcción.java
package com;

import java.io.IOException;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@SuppressWarnings("serial")
public class DemoAction extends HttpServlet {

@Override
public void doGet(HttpServletRequest request, HttpServletResponse response)throws ServletException,
IOException {

String destination = "/WEB-INF/views/com/datatable-demo.jsp";

RequestDispatcher rd = request.getRequestDispatcher(destination);
rd.forward(request, response);
}
}

El último paso sería crear un controlador/servicio web que pasaríamos en el argumento

sAjaxSource de datatable. Recuerde que la respuesta debe ser un texto con formato JSON ya
que datatable solo lee JSON en un parámetro de datos.

4) DatatableDemoAction.java
package com;

import java.io.IOException;
import java.io.PrintWriter;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.json.JSONArray;
import org.json.JSONObject;

@SuppressWarnings("serial")
public class DatatableDemoAction extends HttpServlet {

private String SEARCH_TERM;

private String COL_NAME;

private String DIR;

private int START;

private int AMOUNT;

public void doGet(HttpServletRequest request, HttpServletResponse response)

throws ServletException, IOException {

String[] cols = { "id", "firstName", "lastName", "gender", "address",

"grade" };

JSONObject result = new JSONObject();

int amount = 10;
int start = 0;
int col = 0;
String dir = "asc";
String sStart = request.getParameter("iDisplayStart");
String sAmount = request.getParameter("iDisplayLength");
String sCol = request.getParameter("iSortCol_0");
String sdir = request.getParameter("sSortDir_0");

if (sStart != null) {
start = Integer.parseInt(sStart);
if (start < 0) {
start = 0;
}
}
if (sAmount != null) {
amount = Integer.parseInt(sAmount);
if (amount < 10 || amount > 50) {
amount = 10;
}
}
if (sCol != null) {
col = Integer.parseInt(sCol);
if (col < 0 || col > 5)
col = 0;
}
if (sdir != null) {
if (!sdir.equals("asc"))
dir = "desc";
}

String colName = cols[col];

int total = -1;
try {
total = getTotalRecordCount();
} catch (SQLException e1) {
e1.printStackTrace();
}

AMOUNT = amount;
SEARCH_TERM = request.getParameter("sSearch");
COL_NAME = colName;
DIR = dir;
START = start;

try {
result = getStudentData(total, request);
} catch (ClassNotFoundException e) {
e.printStackTrace();
} catch (SQLException e) {
e.printStackTrace();
}

response.setContentType("application/json");
response.setHeader("Cache-Control", "no-store");
PrintWriter out = response.getWriter();

out.print(result);
}

public JSONObject getStudentData(int total, HttpServletRequest request)

throws SQLException, ClassNotFoundException {

int totalAfterFilter = total;

JSONObject result = new JSONObject();
JSONArray array = new JSONArray();
String searchSQL = "";

try {
Class.forName("com.mysql.jdbc.Driver");
} catch (ClassNotFoundException e) {
e.printStackTrace();
}
String connectionURL = "jdbc:mysql://localhost:3306/MyDB?
user=root&password=mobisoft";
Connection connection = DriverManager.getConnection(connectionURL);
// @formatter:off
String sql = "SELECT " + "id, firstName, lastName, gender, address, "
+ "grade " + "FROM " + "student " + "WHERE "
+ "is_deleted = ? ";

// @formatter:on

String globeSearch = " AND (firstName like &#039;%" + SEARCH_TERM + "%&#039;"

+ "or lastName like &#039;%" + SEARCH_TERM + "%&#039;"
+ "or gender like &#039;%" + SEARCH_TERM + "%&#039;"
+ "or address like &#039;%" + SEARCH_TERM + "%&#039;"
+ "or grade like &#039;%" + SEARCH_TERM + "%&#039;)";

if (SEARCH_TERM != "") {
searchSQL = globeSearch;
}

sql += searchSQL;
sql += " order by " + COL_NAME + " " + DIR;

sql += " limit " + START + ", " + AMOUNT;

PreparedStatement statement = connection.prepareStatement(sql);

statement.setBoolean(1, false);

ResultSet rs = statement.executeQuery();

while (rs.next()) {
JSONArray ja = new JSONArray();

ja.put(rs.getString("id"));
ja.put(rs.getString("firstName"));
ja.put(rs.getString("lastName"));
ja.put(rs.getString("gender"));
ja.put(rs.getString("address"));
ja.put(rs.getString("grade"));

array.put(ja);
}
statement.close();
rs.close();

// @formatter:off
String query = "SELECT " + "COUNT(*) as count " + "FROM " + "student "
+ "WHERE " + "is_deleted = ? ";
// @formatter:on

if (SEARCH_TERM != "") {
query += searchSQL;

PreparedStatement stmt = connection.prepareStatement(query);

stmt.setBoolean(1, false);

ResultSet resultSet = stmt.executeQuery();

if (resultSet.next()) {
totalAfterFilter = resultSet.getInt("count");
}
stmt.close();
resultSet.close();
connection.close();
}
try {
result.put("iTotalRecords", total);
result.put("iTotalDisplayRecords", totalAfterFilter);
result.put("aaData", array);
} catch (Exception e) {

return result;
}

public int getTotalRecordCount() throws SQLException {

int total = -1;

// @formatter:off
String sql = "SELECT " + "COUNT(*) as count " + "FROM " + "student "
+ "WHERE " + "is_deleted = ? ";

// @formatter:on

String connectionURL = "jdbc:mysql://localhost:3306/MyDB?

user=root&password=mobisoft";
try {
Class.forName("com.mysql.jdbc.Driver");
} catch (ClassNotFoundException e) {
e.printStackTrace();
}

Connection connection = DriverManager.getConnection(connectionURL);

PreparedStatement statement = connection.prepareStatement(sql);

statement.setBoolean(1, false);
ResultSet resultSet = statement.executeQuery();

if (resultSet.next()) {
total = resultSet.getInt("count");
}
resultSet.close();
statement.close();
connection.close();

return total;
}

Parámetros enviados al servidor

La siguiente información se envía al servidor para cada solicitud de sorteo. Su secuencia de
comandos del lado del servidor debe usar esta información para obtener los datos necesarios
para el sorteo.
1. iDisplayStart: define el punto de inicio para la visualización de datos cuando se utilizan
tablas de datos con paginación.
2. iDisplayLength: número de filas para mostrar en una sola página cuando se usa la
paginación.
3. iSortCol_(int) – Columna en la que se está ordenando (necesitará decodificar este número
para su base de datos).
4. sSortDir_(int) – Dirección a ordenar – “desc” o “asc”.
5. sSearch: campo de búsqueda global.
6. iColumns: número de columnas que se muestran (útil para obtener información de
búsqueda de columnas individuales).

Responder desde el servidor

En respuesta a cada solicitud de información que hace DataTables al servidor, espera obtener
un objeto JSON bien formado con los siguientes parámetros.
1. iTotalRecords: registros totales, antes del filtrado (es decir, el número total de registros en la
base de datos).
2. iTotalDisplayRecords: registros totales, después del filtrado (es decir, el número total de
registros después de aplicar el filtrado, no solo el número de registros que se devuelven en
este conjunto de resultados).
3. aaData- Los datos en una matriz 2D. Tenga en cuenta que puede cambiar el nombre de este
parámetro con sAjaxDataProp.
Todas las acciones que ve en el componente se implementan en el lado del servidor. Puede ver
una lista completa de complementos de DataTable adicionales en el sitio de DataTables. Todos
estos complementos son complementos adicionales para DataTables, pero también puede
usar la potente API de DataTables para personalizar el comportamiento. En la siguiente figura
se muestra un ejemplo de la tabla simple mejorada con algunos complementos mencionados:

En este ejemplo, hemos usado la biblioteca JSON para serializar objetos Java a JSON, pero
puede usar cualquier otra biblioteca de serialización JSON en su lugar.
Puede encontrar algún ejemplo en el sitio DataTables . Lo único importante es que devuelva
una respuesta JSON con objetos que coincidan con el estado actual de la tabla.

Conclusión
Este ejemplo muestra cómo puede crear tablas efectivas y completamente funcionales en una
aplicación web Java utilizando el complemento jQuery DataTables. Con los ejemplos de código
del artículo, puede mejorar significativamente el aspecto y las funcionalidades de su aplicación
web. Le recomiendo que lo pruebe: cuando integre jQuery DataTables en algunas tablas de su
aplicación, verá que la implementación es sencilla y que, con algo de práctica, podrá
implementar muchas funcionalidades con muy poco esfuerzo.
Puede descargar el ejemplo de código en el proyecto adjunto que se creó en Eclipse Java EE
IDE para desarrolladores web, que se ejecuta en un servidor web Tomcat 6.0 y he
usado Ant para la implementación del proyecto. Le sugiero que cree un nuevo proyecto,
configúrelo con su tomcat (no es necesario ir con Ant si no tiene la configuración de Ant , así
que elimine el archivo build.properties y el archivo build.xml y configure este proyecto con su
configuración local de tomcat ), y agregue clases que pueda encontrar en el proyecto. Espero
que este ejemplo le ayude a crear mejores interfaces de tabla.