Friends. I want to populate the search box which is like a dropdown list which will populate dynamically when something is typed into it with user's full name which is made up firstname and lastname. The jsp form has this search box(drop down list) . I am using ajax so that I can show the ArrayList which contains all the user's full name dynamically as the user enters the name in search box. I am totally new to ajax or jquery. Please guide me for passing the arrayList data from the servlet as response to ajax or jquery script and populate the dropdown asynchronously. Please help
Here is my servlet code
@WebServlet("/someservlet/*")
public class AjaxExampleServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//Database connection
try {
Connection currentCon = ConnectionManager.getConnection();
currentCon.setAutoCommit(true);
ResultSet rs;
Statement stmt = null;
stmt = currentCon.createStatement();
//create the query
String query = "select firstname,lastname,username from users";
//executing the query
rs = stmt.executeQuery(query);
//creating a hashmap
ArrayList<String> UserFullName = new ArrayList<String>();
//fill the hashmap UserFullName with firstname and lastname of the user fetched from the database
while(rs.next())
{
UserFullName.add(rs.getString("firstname") + rs.getString("lastname"));
}
response.setContentType("text/plain"); // Set content type of the response so that jQuery knows what it can expect.
response.setCharacterEncoding("UTF-8");
request.setAttribute("list", UserFullName);
RequestDispatcher requestDispatcher = request.getRequestDispatcher("response.jsp");
requestDispatcher.forward(request, response);
and my first jsp page
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
</script>
</head>
<body>
<form action="someservlet" method="get">
<button type="submit" id="somebutton">press here</button>
</form>
</body>
</html>
and my response.jsp
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<button id="somebutton">press here</button>
<div id="somediv">
<label for="users">Users</label>
<select id="users" multiple="multiple">
<c:forEach var="listvar" items="${list}">
<option value="${listvar}">${listvar}</option>
</c:forEach>
</select>
</div>
</body>
</html>
I want my response in the same jsp from first jsp page where the users where searched directly into the search dropdown list using ajax,jquery. Examples are welcomed. Please help friends.