Populate select list with Java/Ajax

[Jeremy720]

Hi. I'm trying to populate a select list based on the selection of another select list using Ajax. The select has an onchange event that passes the selected value to the ajax script. In my java class, which retrieves the second select list's data from the database, I attempt to call request.getParameter("selectedValue"), but it is not populating the select list because request.getParameter("selectedValue") is returning null. I have stumped two people with this so far. Perhaps YOU can give me a clue :). Any advise is appreciated. Here is the code:

[CODE]<!--THE index.jsp -->
 <form name ="books" method="post" action="">
            <select name="bookDropDown" id="bookDropDown" onchange="htmlData(this.value, 'getChapters')">
           <c:forEach var="book" items="${bookList}">
               <option value=${book.bookName}>${book.bookName}</option>
           </c:forEach>
         </select>
           
           <h2>Chapters</h2>

         <div id="txtResult">
          <select name="chapterList" id="chapterList">
           <option></option>
          </select>
         </div>
        </form>
<!-- END index.jsp -->

<!--AJAX ajaxRequest.js -->
function GetXmlHttpObject(handler)
{
   var objXMLHttp=null
   if (window.XMLHttpRequest)
   {
       objXMLHttp=new XMLHttpRequest()
   }
   else if (window.ActiveXObject)
   {
       objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP")
   }
   return objXMLHttp
}

function stateChanged()
{
   if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
   {
           document.getElementById("txtResult").innerHTML = xmlHttp.responseText; //"<select><option>Hello</option></select>"; //
   }
   else {
           //alert(xmlHttp.status);
   }
}

function htmlData(selectedValue, url)
{
   if (url.length==0)
   {
       document.getElementById("txtResult").innerHTML="";
       alert("URL equals FAIL");
       return;
   }
   xmlHttp=GetXmlHttpObject()
   if (xmlHttp==null)
   {
       alert ("Browser does not support HTTP Request");
       return;
   }

   xmlHttp.onreadystatechange=stateChanged;
   xmlHttp.open("POST",url,true);
   xmlHttp.send("dropDown=" + selectedValue); //Name/value pair
}
<!-- END AJAX -->

<!-- SERVLETT getChapters.java -->
public class GetChapters extends HttpServlet {
 ArrayList<Chapter> chapters;
 int bookID;
 DAO dao;
    @Override
    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws IOException, ServletException {
        HttpSession session = request.getSession();
	session.setMaxInactiveInterval(60*60);
        dao = new DAO();
        
        String book = request.getParameter("dropDown");
        System.out.println(book);

        ArrayList<CookBook> bookList = (ArrayList<CookBook>)getServletContext().getAttribute("bookList");

        ListIterator<CookBook> itr = bookList.listIterator();
        while (itr.hasNext()){
            if(itr.next().bookName.equals(book)){
                bookID = itr.next().bookID;
                session.setAttribute("bookID", bookID);
            }
        }

        chapters = dao.getChapters(bookID); //new ArrayList<Chapter>();//

        session.setAttribute("chapters", chapters);
        RequestDispatcher rd = request.getRequestDispatcher("replaceText.jsp");
        rd.forward(request, response);
    }

    @Override
    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws IOException, ServletException {}
}
<!-- END SERVLET -->[/CODE]

I would include the database call, but it won't matter until I figure out why the String book = request.getParameter("dropDown"); System.out.println(book); is printing 'null'
Thanks.

[Jeremy720]

I should mention that 1) I've tried hard-coding a value for the ajax send function, but still it prints 'null' 2) When hard coding a value returned by the DAO call, the select list populates correctly.
hmm.

[Jeremy720]

Oh...and here is the replaceText.jsp:

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@page isELIgnored="false"%>

<select name="chapterDropDown" id="chapterDropDown">
     <c:forEach var="chapters" items="${chapters}">
               <option value=${chapters.chapterName}>${chapters.chapterName}</option>
     </c:forEach>
</select>

[go4soumya]

Hi Jeremy,

Since u said :

String book = request.getParameter("dropDown"); System.out.println(book); is printing 'null'

and

I should mention that 1) I've tried hard-coding a value for the ajax send function, but still it prints 'null' 2) When hard coding a value returned by the DAO call, the select list populates correctly.

I recommend you try changing a bit of code in your ajaxRequest.js. Replace the lines:

xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("POST",url,true);
xmlHttp.send("dropDown=" + selectedValue); //Name/value pair

with this piece of code:

url=url+"?dropDown="+selectedValue;  
url=url+"&sid="+Math.random();
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("GET",url,true);
xmlHttp.send(null);

Try this and report back. Hope it'll work!!..

Good luck.