In this help topic you will learn how to bind a jqxDataTable to a MySQL database using JSP (JavaServer Pages) and implement server-side sorting, paging and filtering.
Important: before proceeding, please make sure you have followed the instructions of the tutorial Configure MySQL, Eclipse and Tomcat for Use with jQWidgets.
To populate the data table, we need a JSP file that connects to the Northwind database and retieves data from it depending on the sorting and filtering applied to the data table, the current page it is on and the page size.
Create a new JSP by right-clicking the project's
then choosing New → JSP File. Name the file
Import the necessary classes in the beginning of the JSP:
Finally, add a scriptlet to the JSP that does the following:
Create a new HTML page by right-clicking the project's
then choosing New → HTML File. Here is the code
of the page in our example:
Through jqxDataAdapter, the data table is populated by the data retrieved from the
populate-datatable.jsp. In the formatData
callback of data adapter, we create and format new parameters to be passed to the
server-side. These parameters are retrieved and used in
In the source callback beforeprocessing, we get the source.totalRecords
from the data passed to the first element of the data array. Another key point is
that the data table's serverProcessing property has to be set to
To run the page, right-click it and select Run As → Run on Server. In the window that appears, select Tomcat v8.0 Server at localhost and click Finish.