如何在不使用ajax刷新页面的情况下将值从数据库显示到jsp

Question

我是阿贾克斯大学的新生

AJAX

function ajaxFunction() {
  if(xmlhttp) { 
   var txtname = document.getElementById("txtname");
    xmlhttp.open("POST","Namelist",true);

    xmlhttp.onreadystatechange  = handleServerResponse;
    xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    xmlhttp.send("txtname=" + txtname.value); 
  }
}

function handleServerResponse() {
   if (xmlhttp.readyState == 4) {
     if(xmlhttp.status == 200) {
       document.getElementById("message").innerHTML=xmlhttp.responseText;
     }
     else {
        alert("Error during AJAX call. Please try again");
     }
   }
}

jsp

<form name="fname" action="Namellist" method="post">

    Select Category :
    <select name="txtname" id="txtname">
     <option value="Hindu">Hindu</option>
     <option value="Muslim">Muslim</option>
     <option value="Christian">Christian</option>
    </select>
    <input type="button" value="Show" id="sh" onclick="ajaxFunction();">
    <div id="message">here i want to display name</div><div id="message1">here i want to display meaning</div>
    </form>

Servlet

String ct=null;  
ct=request.getParameter("txtname");
      Connection con=null;
      ResultSet rs=null;
      Statement st=null;
try{
con=Dbconnection.getConnection();
PreparedStatement ps=con.prepareStatement("select name meaning from (select * from namelist order by dbms_random.value)where rownum<=20 and category='+ct+'" );
rs=ps.executeQuery();

 out.println("name" + rs);
 **Here I have confusion,**

}
catch(Exception e)
{
    System.out.println(e);
}

我如何将servlet值diaplay到jsp。请帮帮我？或者请提供一些好的教程链接。

Answer 1

可能是现成的，但可能有用，而不是为Ajax调用提供所有javascript，使用一些javascript库（最好是jQuery）来进行Ajax调用。

您使用的任何javascript库都将帮助您使代码紧凑、简洁，还将帮助您保持跨浏览器兼容性。

如果您计划自己编写所有XHTTP代码，那么最终可能会花费大量时间来解决跨浏览器问题，并且您的代码将面临大量的黑客攻击，而不是实际的业务逻辑。

此外，使用像jQuery这样的库也可以用更少的代码行实现同样的功能。

希望有帮助。

Answer 2

1.在servlet代码
中

PrintWriter output = response.getWriter();  
String result = "value";  
writer.write(result);  
writer.close()

2.为什么不使用jquery
您可以在上替换代码-

$.post('url', function(data) {  
$('#message1').html(data);  
});

查询帖子示例

Answer 3

您必须进行以下更改：-在Servlet中：-将响应内容类型设置为：-response。setContentType（“文本/xml”） 位于servlet的顶部。通过设置它，我们可以以XML格式发送响应，在JSP上检索时，我们将根据XML的标记名获得响应。

在servlet中执行任何操作。。。把这个值留到ex-

String uname=";
     uname="hello"; //some operation
    //create one XML string
    String sendThis="<?xml version='1.0'?>"
            +"<Maintag>"
            +"<Subtag>"
            +"<unameVal>"+uname+"</unameVal>"     
            +"</Subtag>"
            +"</Maintag>"
  out.print(sendThis);

现在我们将转到JSP页面，在那里我们必须显示数据。

    function getXMLObject()  //XML OBJECT
        {
            var xmlHttp = false;
            try {
                xmlHttp = new ActiveXObject("Msxml2.XMLHTTP")  // For Old Microsoft Browsers
            }
            catch (e) {
                try {
                    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP")  // For Microsoft IE 6.0+
                }
                catch (e2) {
                    xmlHttp = false   // No Browser accepts the XMLHTTP Object then false
                }
            }
            if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {
                xmlHttp = new XMLHttpRequest();        //For Mozilla, Opera Browsers
            }
            return xmlHttp;  // Mandatory Statement returning the ajax object created
        }
    var xmlhttp = new getXMLObject();   //xmlhttp holds the ajax object
        function ajaxFunction() {
            if(xmlhttp) {
                xmlhttp.open("GET","NameList",true); //NameList will be the servlet name
                xmlhttp.onreadystatechange  = handleServerResponse;

                xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
                xmlhttp.send(null);
            }
        }
        function handleServerResponse() {
            if (xmlhttp.readyState == 4) {
                if(xmlhttp.status == 200) {
                   getVal();
                }
                else {
                    alert("Error during AJAX call. Please try again");
                }
            }
        }
       function getVal()
        {
             var xmlResp=xmlhttp.responseText;
             try{

                if(xmlResp.search("Maintag")>0 )
                {
               var x=xmlhttp.responseXML.documentElement.getElementsByTagName("Subtag");
                    var xx=x[0].getElementsByTagName("unameVal"); 
                    var recievedUname=xx[0].firstChild.nodeValue;
                   document.getElementById("message").innerText=recievedUname;//here 
                } 
                }catch(err2){
                    alert("Error in getting data"+err2);
                }
        }

现在你完成了。：）