如何使用Servlet和Ajax?

我是Web應用程序和Servlet的新手,我有如下問題: javascript

每當我在Servlet中打印某些內容並由網絡瀏覽器調用它時,它將返回一個包含該文本的新頁面。 有沒有一種方法能夠使用Ajax在當前頁面中打印文本? html


#1樓

我將向您展現servlet的整個示例以及ajax調用的方式。 java

在這裏,咱們將建立一個簡單的示例,以使用servlet建立登陸表單。 ajax

index.html json

<form>  
   Name:<input type="text" name="username"/><br/><br/>  
   Password:<input type="password" name="userpass"/><br/><br/>  
   <input type="button" value="login"/>  
</form>

這是ajax示例 瀏覽器

$.ajax
        ({
            type: "POST",           
            data: 'LoginServlet='+name+'&name='+type+'&pass='+password,
            url: url,
        success:function(content)
        {
                $('#center').html(content);           
            }           
        });

LoginServlet Servlet代碼:- 服務器

package abc.servlet;

import java.io.File;


public class AuthenticationServlet extends HttpServlet {

    private static final long serialVersionUID = 1L;

    protected void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException
    {   
        doPost(request, response);
    }

    protected void doPost(HttpServletRequest request,
            HttpServletResponse response) throws ServletException, IOException {

        try{
        HttpSession session = request.getSession();
        String username = request.getParameter("name");
        String password = request.getParameter("pass");

                /// Your Code
out.println("sucess / failer")
        } catch (Exception ex) {
            // System.err.println("Initial SessionFactory creation failed.");
            ex.printStackTrace();
            System.exit(0);
        } 
    }
}

#2樓

$.ajax({
type: "POST",
url: "url to hit on servelet",
data:   JSON.stringify(json),
dataType: "json",
success: function(response){
    // we have the response
    if(response.status == "SUCCESS"){
        $('#info').html("Info  has been added to the list successfully.<br>"+
        "The  Details are as follws : <br> Name : ");

    }else{
        $('#info').html("Sorry, there is some thing wrong with the data provided.");
    }
},
 error: function(e){
   alert('Error: ' + e);
 }
});

#3樓

Ajax(也是AJAX,是異步JavaScript和XML的首字母縮寫)是一組相互關聯的Web開發技術,用於客戶端以建立異步Web應用程序。 使用Ajax,Web應用程序能夠異步向服務器發送數據和從服務器檢索數據。下面是示例代碼: 網絡

Jsp頁面Java腳本函數使用兩個變量firstName和lastName將數據提交到servlet: session

function onChangeSubmitCallWebServiceAJAX()
    {
      createXmlHttpRequest();
      var firstName=document.getElementById("firstName").value;
      var lastName=document.getElementById("lastName").value;
      xmlHttp.open("GET","/AJAXServletCallSample/AjaxServlet?firstName="
      +firstName+"&lastName="+lastName,true)
      xmlHttp.onreadystatechange=handleStateChange;
      xmlHttp.send(null);

    }

Servlet讀取以xml格式發送回jsp的數據(您也能夠使用文本。只須要將響應內容更改成文本並在javascript函數上呈現數據便可。) app

/**
 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
 */
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

    String firstName = request.getParameter("firstName");
    String lastName = request.getParameter("lastName");

    response.setContentType("text/xml");
    response.setHeader("Cache-Control", "no-cache");
    response.getWriter().write("<details>");
    response.getWriter().write("<firstName>"+firstName+"</firstName>");
    response.getWriter().write("<lastName>"+lastName+"</lastName>");
    response.getWriter().write("</details>");
}

#4樓

使用引導多選

阿賈克斯

function() { $.ajax({
    type : "get",
    url : "OperatorController",
    data : "input=" + $('#province').val(),
    success : function(msg) {
    var arrayOfObjects = eval(msg); 
    $("#operators").multiselect('dataprovider',
    arrayOfObjects);
    // $('#output').append(obj);
    },
    dataType : 'text'
    });}
}

在Servlet中

request.getParameter("input")

#5樓

一般,您沒法從servlet更新頁面。 客戶端(瀏覽器)必須請求更新。 Eiter客戶端加載整個新頁面,或者請求更新現有頁面的一部分。 這種技術稱爲Ajax。

相關文章
相關標籤/搜索