Hi,
I am ajax in following concept.
In jsp page have 2 div.
first div contaion one dropdownlist for selection city onChange event send data to servlet
and other div contain another dropdownlist for displaying cities
which are come from servlet.
Here problem is after selecting city through 1st dropdownlist
first div is stable but bellow that displayed content of fiat
div also and second div.
so please help me.
output is as follows-
without selecting city
AJAX
<first dropdownlist>
This is myDiv null
After selecting city
AJAX 1
<first dropdownlist with selected city> 2
AJAX 3
<first dropdownlist> 4
This is myDiv Pune <second dropdownlist> 5
in above line number 3 and 4 unwanted displayed.
Thanks in advance.
jsp code.
<html>
<head>
<script type="text/javascript">
function loadXMLDoc()
{
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
// document.frmIndex.listFrom.options[document.frmIndex.listFrom.selectedIndex].value
var selectedCity = document.frmAjaxDemo.listFrom.options[document.frmAjaxDemo.listFrom.selectedIndex].value
alert("Selected city is "+selectedCity)
xmlhttp.open("GET","TrialServlet?city="+selectedCity+"&cityto=selectCity",true);
xmlhttp.send();
}
</script>
</head>
<body>
<form name="frmAjaxDemo">
<div id="fis">
<h2>AJAX</h2>
<div id="myDiv1">
<select name="listFrom" id="listFromId" onchange="loadXMLDoc()">
<option>SelectCity</option>
<option>Pune</option>
<option>Karad</option>
</select>
</div>
</div>
<div id="myDiv">This is myDiv
<%
String getcity=null;
Iterator itr=null;
getcity = (String) request.getAttribute("sndcity");
if(getcity!=null)
{
//getcity = (String) request.getAttribute("sndcity");
List list = (List)request.getAttribute("sndlistDest");
itr = list.iterator();
/* while(itr.hasNext())
{
out.println(itr.next());
}*/
}
%>
<%=getcity%>
<select name="lsitTo" id="listToId">
<option>SelectDest</option>
<%if(getcity!=null)
{
while(itr.hasNext())
{%>
<option><%=itr.next()%></option>
<%}
}%>
</select>
</div>
</form>
</body>
</html>
Servlet code.
/*
* To change this template, choose Tools | Templates
* and open the template in the editor.
*/
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.RequestDispatcher;
import java.util.ArrayList;
import java.util.Iterator;
/**
*
* @author node4
*/
public class TrialServlet extends HttpServlet {
/**
* Processes requests for both HTTP <code>GET</code> and <code>POST</code> methods.
* @param request servlet request
* @param response servlet response
* @throws ServletException if a servlet-specific error occurs
* @throws IOException if an I/O error occurs
*/
protected void processRequest(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html;charset=UTF-8");
PrintWriter out = response.getWriter();
String str = request.getParameter("city");
String str1 = request.getParameter("cityto");
ArrayList listDest = new ArrayList();
try {
out.println("Selected city is "+str);
out.println("City to is "+str1);
out.println("This is servlet");
listDest.add("Solapur");
listDest.add("Mumbai");
listDest.add("Kolhapur");
listDest.add("Shimala");
Iterator itr = listDest.iterator();
while(itr.hasNext())
{
out.println(itr.next());
}
request.setAttribute("sndlistDest", listDest);
request.setAttribute("sndcity", str);
RequestDispatcher dispatcher = request.getRequestDispatcher("AjaxDemo.jsp");
if(dispatcher != null)
{
dispatcher.forward(request, response);
}
} catch(Exception e) {
out.println(e);
}
}
// <editor-fold defaultstate="collapsed" desc="HttpServlet methods. Click on the + sign on the left to edit the code.">
/**
* Handles the HTTP <code>GET</code> method.
* @param request servlet request
* @param response servlet response
* @throws ServletException if a servlet-specific error occurs
* @throws IOException if an I/O error occurs
*/
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
processRequest(request, response);
}
/**
* Handles the HTTP <code>POST</code> method.
* @param request servlet request
* @param response servlet response
* @throws ServletException if a servlet-specific error occurs
* @throws IOException if an I/O error occurs
*/
@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
processRequest(request, response);
}
/**
* Returns a short description of the servlet.
* @return a String containing servlet description
*/
@Override
public String getServletInfo() {
return "Short description";
}// </editor-fold>
}