Basic Connection Without DataTables

If you are creating a web application there will likely be some webpages you will create that don't involve a table structure at all. You may want to just perform a quick and simple query. A good example of this may be to display a welcome to the user after they have logged onto your application. This example, when it loads, will perform an AJAX request to the server side while providing a user ID (numeric identifier) as a parameter. Alternatively, you could use the JQuery function getJSON(url,parameters,callback). This ID may have been stored in a cookie on the users computer. For demonstration purposes, we will use an ID value we know exists in our database and display a welcome to a user named Terrance Streeter. In this case we will call a Java Server Page. You can, of course, use a servlet if you prefer. The JSP (Java Server Page) performs a lookup on a table containing user information. The JSP makes use of a method in the Database class named executeSelect(String query). For this method the first parameter is your String representation of your query. Since your query will be asking for any number of fields for retrieval, you need to indicate to the method how many of these fields/columns there are so that the proper number of iterations are performed inside the method.

Our query will be quite simple: "SELECT first_name, last_name FROM employees WHERE id = 29"
Therefore, our JSP code will contain:

String id = request.getParameter("id");
String query = "SELECT first_name, last_name FROM employees WHERE id = " + id;
Database db = new Database("editor");
String[][] result = db.executeSelect(query);

executeSelect(...) returns a 2D String array. You have only to iterate over the array to obtain your data and return it to the client side any way you like. For this example we will return a JSON string. When the AJAX request recieves the data, we will concatonate the first name with the last name and display the result in a welcome to a DIV element with an id of "welcome". See the Tab control below for details.

LIVE EXAMPLE:


Javascript
HTML
Java
Includes