从servlet请求不同的响应，并使用AJAX和JSP

Ask different response from servlet and use AJAX and JSP

本文关键字：AJAX JSP 响应 请求 servlet      更新时间：2023-09-26

我是这方面的新手，我的意思是使用JSP、servlet和JavaScript/jQuery/AAJAX。我想让下拉菜单来自新的响应取决于请求。但是，我似乎找不到让servlet发送不同响应的方法
我想使用AJAX来避免页面重新加载，因此将重新加载特定的下拉元素
我为服务器端提供了服务。我放在这里的代码就是客户端的代码。在客户端，我们使用JSP、Servlet和JavaScript/jQuery。

这是我的JSP：

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML>
<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Coba aja</title>
        <script src="../js/jquery.min.js"></script>
        <script src="../js/basic.js"></script>
    </head>
    <body>
        <select name="idprovinsi" id="idprovinsi">
            <option value="" >--Pilih Provinsi--</option>
        </select>
        <select name="idkota" id="idkota">
            <option value="" >--Pilih Kota/Kabupaten--</option>
        </select>
        <select name="idkecamatan" id="idkecamatan">
            <option value="" >--Pilih Kecamatan--</option>
        </select>
        <select name="iddesa" id="iddesa">
            <option value="" >--Pilih Desa--</option>
        </select>
        <input type="hidden" id="dropdown" value="">
    </body>
</html>


这是我的JavaScript：

var arrayProvinsi = new Array();
var arrayKota = new Array();
var arrayKecamatan = new Array();
var arrayDesa = new Array();
$(document).ready(function() {
$('#idkota').hide();
$('#idkecamatan').hide();
$('#iddesa').hide();
//alert("load pertama kali!");

    $('#idprovinsi').ready(function(){
        //alert("masuk ready!");
       $.ajax({
           url:"../update",
            type:"POST",
            dataType:"json",
            success: function(msg){
                //alert(msg);
                //alert(msg.length);
                var temp = new Array();
                temp = msg.arrayProvinsi;
                //alert(temp);
                //alert(temp.length);
                var selObj = document.getElementById("idprovinsi");
                for (var i=0; i < temp.length;++i)
                {
                    //alert("nama:"+msg[i].provinsiname);
                    addOptionProvinsi(selObj, temp[i].provinsiname, temp[i].idprovinsi);
                }
            }
       });
    });
    $('#idprovinsi').change(function(){
        //alert($('#idprovinsi').val());        
        $('#idkota').show();
        $('#dropdown').val("kota");
        alert("dropdown provinsi change alert! nilai id provinsi: "+$('#idprovinsi').val()+" nilai dropdown:"+$('#dropdown').val());
         $.ajax({
           url:"../update",
            type:"POST",
            dataType:"json",
            success: function(msg){
                alert(msg.length);
                var temp = new Array();
                temp = msg.arrayKota;
                alert(temp.length);
                var selObj = document.getElementById("idkota");
                for (var i=0; i < msg.length;++i)
                {
                    alert("nama:"+temp[i].kotaname);
                    addOptionKota(selObj, msg[i].kotaname, msg[i].idkota);
                }
            }
       });
    });
});
function addOptionProvinsi(selectbox,text,value )
{
    if(isInArray(text, arrayProvinsi)){
    }else{
        arrayProvinsi.push(text);
        var optn = document.createElement("OPTION");
        optn.text = text;
        optn.value = value;
        selectbox.options.add(optn);
    }
}
function addOptionKota(selectbox,text,value )
{
    if(isInArray(text, arrayKota)){
    }else{
        arrayKota.push(text);
        var optn = document.createElement("OPTION");
        optn.text = text;
        optn.value = value;
        selectbox.options.add(optn);
    }
}
function isInArray(value, array) {
  return array.indexOf(value) > -1 ? true : false;
}


这是我的servlet：

@WebServlet("/update")
public class CobaServlet extends HttpServlet {
    @Override
    protected void doGet(HttpServletRequest request, HttpServletResponse response)
    throws ServletException, IOException {
    } 
    @Override
    protected void doPost(HttpServletRequest request, HttpServletResponse response)
    throws ServletException, IOException {
        Map <String,Object> map= new HashMap<String, Object>();
        //get data All Provinsi
        String url="";
    CallService cs= new CallService();
    String feedback ="";
        MultivaluedMapImpl  params = new MultivaluedMapImpl();
        String dropdown     = request.getParameter("dropdown");
        String idprovinsi   = request.getParameter("idprovinsi");
        String idkota       = request.getParameter("idkota");
        String idkecamatan  = request.getParameter("idkecamatan");
        String iddesa       = request.getParameter("iddesa");

        if(idprovinsi != null && !idprovinsi.equals("")){
            //get data All Kota
            url = "http://localhost:8080/sPuskesmas/rest/kotaservice/getKotaByIdprovinsi";
            params.add("idprovinsi", idprovinsi);
            feedback = cs.callGetService(url,params);
            JSONArray arrayKota= JsonToArray.toArray(feedback);
            //write(response, arrayKota);
            //request.setAttribute("arrayKota", arrayKota);
            map.put("arrayKota", arrayKota);
            write(response,map);
         }
        else if(idprovinsi==null || idprovinsi.equals("")){
            url = "http://localhost:8080/sPuskesmas/rest/provinsiservice/getAllProvinsi";
            feedback = cs.callGetService(url);
            JSONArray arrayProvinsi= JsonToArray.toArray(feedback);
            //write(response, arrayProvinsi);
            //request.setAttribute("arrayProvinsi", arrayProvinsi);
            map.put("arrayProvinsi", arrayProvinsi);
            write(response,map);
        }
    }
    private void write(HttpServletResponse response, Map<String, Object> map) throws IOException {
        response.setContentType("application/json");
        response.setCharacterEncoding("UTF-8");
        response.getWriter().write(new Gson().toJson(map));
    }
    private void write(HttpServletResponse response, JSONArray arrayNya) throws IOException {
        response.setContentType("application/json");
        response.setCharacterEncoding("UTF-8");
        response.getWriter().write(new Gson().toJson(arrayNya));
    }
}


我不知道我怎么会得到不同的回应，因为我总是得到相同的第一个回应我只想访问servlet的不同部分，这样我就可以得到我想要的响应。你能帮我解决吗？

非常感谢。

您可以做的是将一个参数传递给类似的servlet

$.ajax({
          type: 'POST',
          url: 'servletname?&selecttype=idprovinsi', //change this for each combo
          success:function(data){
          }
        });

servlet中的

    String type= req.getParameter("selecttype");
    if(type.equals("idprovinsi")){
   --dosomething
   }

在servlet中处理该参数，并在响应中产生差异。

得益于此，组合取得了成功。

相关文章：