Java Stripes和Jquery以及用于动态下拉列表的Ajax

我在web层使用条纹。我想包括两个下拉列表，其中第二个下拉列表中的项目列表取决于第一个下拉列表中选择的值

---

你说得很直截了当。我找不到一个这样做的例子。Stripes站点上的示例都很简单，比如更新标签。我读到，Stripes返回的JSON很时髦&jQuery无法直接处理。我该怎么做？举个例子将不胜感激

使用jQuery的javascript部分相当简单。将更改处理程序附加到第一个值，并针对每个更改向服务器请求特定于新值的数据

响应可以是JSON或html。以下假设服务器将返回html：

$('#select_1').change(function(){
    var data={ select_1_val : $(this).val() };
     /* make ajax request and load result into select_2*/
    $('#select_2').load('/path/to/server', data);    
});

在您的服务器控制器上，您将处理一个GET请求并提取GET参数select_1_val的值，然后执行任何需要的后端魔术，只返回一组标记，您可以使用Google Gson 例如：

import com.google.gson.Gson;

public Resolution autocomplete() {

    List<String> opts = new ArrayList<String>();

    ...

    String json = new Gson().toJson(opts);
    return new StreamingResolution("application/json",json);
}

动作豆

  package com.rajamma.dealmeister.web.actions;

import java.util.ArrayList;
import java.util.List;

import net.sourceforge.stripes.action.DefaultHandler;
import net.sourceforge.stripes.action.ForwardResolution;
import net.sourceforge.stripes.action.Resolution;
import net.sourceforge.stripes.action.SessionScope;
import net.sourceforge.stripes.action.StreamingResolution;

import com.google.gson.Gson;
import com.rajamma.dealmeister.domain.Item;

    @SessionScope
    public class DropDownActionBean extends AbstractActionBean
    {

        List<Item> habitatList = new ArrayList<Item>();
        List<Item> animalList = new ArrayList<Item>();

        private String selectHabitat = "1";
        private String selectAnimal;

        public DropDownActionBean()
        {

            habitatList.add(new Item(1, "Land"));
            habitatList.add(new Item(2, "Sea"));
            habitatList.add(new Item(3, "Air"));

            animalList.add(new Item(1, "please choose Habitat"));

        }

        public List<Item> getHabitatList()
        {
        return habitatList;
        }

            public void setHabitatList(List<Item> habitatList)
        {
            this.habitatList = habitatList;
        }

        public List<Item> getAnimalList()
        {
            return animalList;
        }

        public void setAnimalList(List<Item> animalList)
        {
            this.animalList = animalList;
        }

    public String getSelectHabitat()
    {
        return selectHabitat;
    }

    public void setSelectHabitat(String selectHabitat)
    {
        this.selectHabitat = selectHabitat;
    }

    public String getSelectAnimal()
{
    return selectAnimal;
}

public void setSelectAnimal(String selectAnimal)
{
    this.selectAnimal = selectAnimal;
}

@DefaultHandler
public Resolution test()
{
    return new ForwardResolution("/WEB-INF/jsp/deal/DropDownTest.jsp");
}

public Resolution populateDropDownList()
{
    if (selectHabitat.equals("1")) // Land
    {
        animalList = new ArrayList<Item>();
        animalList.add(new Item(1, "Lion"));
        animalList.add(new Item(2, "Tiger"));
        animalList.add(new Item(3, "Horse"));
        animalList.add(new Item(4, "Elephant"));
    }
    if (selectHabitat.equals("1")) // Land
    {
        animalList = new ArrayList<Item>();
        animalList.add(new Item(1, "Lion"));
        animalList.add(new Item(2, "Tiger"));
        animalList.add(new Item(3, "Horse"));
        animalList.add(new Item(4, "Elephant"));
    }
    if (selectHabitat.equals("2")) // Sea
    {
        animalList = new ArrayList<Item>();
        animalList.add(new Item(1, "Whale"));
        animalList.add(new Item(2, "Shark"));
        animalList.add(new Item(3, "Dolphin"));
        animalList.add(new Item(4, "Octopus"));
    }
    if (selectHabitat.equals("3")) // Sea
    {
        animalList = new ArrayList<Item>();
        animalList.add(new Item(1, "Eagle"));
        animalList.add(new Item(2, "Vulture"));
        animalList.add(new Item(3, "Swift"));
        animalList.add(new Item(4, "Crow"));
    }
    String json = new Gson().toJson(animalList);
    return new StreamingResolution("application/json", json);
}

    public Resolution submit()
{
    return new ForwardResolution("/WEB-INF/jsp/deal/DropDownTest.jsp");
}

    }

Stripes/JSP页面

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="stripes" uri="http://stripes.sourceforge.net/stripes.tld" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>

<html>
<head><title>Simple jsp page</title>
    <script type="text/javascript" src="../js/jquery-latest.js"></script>    
        <script type="text/javascript">

            function invokeForJson(form, event, container) {

                    params = {};
                    if (event != null) params = event + '&' + $(form).serialize();            
                 $.post(form.action,
                    params,
                        function (data) {
                         var listItems = "";

                        if (data) {
                             for(var i = 0; i < data.length;i++)
                             {
                                listItems+="<option value='" + data[i].value + "'>" + data[i].label + "</option>";
                         }
                         $(container).html(listItems);   
                        }
                    });
    }


        $(function() {
                $('#dropdown1').change(function() {
                    var selectedValue = $(this).val();
                invokeForJson($('form')[0], 'populateDropDownList', '#dropdown2');
                });         
        });

    </script>
</head>
<body>

<stripes:form beanclass="com.rajamma.dealmeister.web.actions.DropDownActionBean">
    <stripes:select  id="dropdown1" name="selectHabitat">
          <c:forEach var="item" items="${actionBean.habitatList}">
                <option value="${item.value}">${item.label}</option>
        </c:forEach>
    </stripes:select>

    <stripes:select name="selectAnimal" id="dropdown2">
              <c:forEach var="item" items="${actionBean.animalList}">
                <option value="${item.value}">${item.label}</option>
        </c:forEach>
    </stripes:select>

    <stripes:submit name="submit"/>


</stripes:form>

</body>
</html>

---

我在这里为其他可能有相同问题的Stripes/Json人员发布了完整的测试程序。我有一个名为Item的2字段JavaBean，它包含一个名称-值对。这将被序列化并发送到jsp页面。这个例子很简单，第一个下拉列表是栖息地下拉列表，下一个动态下拉列表是生活在该栖息地的动物列表。用户选择也会绑定并保存到selectedHabitat和selectedAnimal。

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="stripes" uri="http://stripes.sourceforge.net/stripes.tld" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>

<html>
<head><title>Simple jsp page</title>
    <script type="text/javascript" src="../js/jquery-latest.js"></script>    
        <script type="text/javascript">

            function invokeForJson(form, event, container) {

                    params = {};
                    if (event != null) params = event + '&' + $(form).serialize();            
                 $.post(form.action,
                    params,
                        function (data) {
                         var listItems = "";

                        if (data) {
                             for(var i = 0; i < data.length;i++)
                             {
                                listItems+="<option value='" + data[i].value + "'>" + data[i].label + "</option>";
                         }
                         $(container).html(listItems);   
                        }
                    });
    }


        $(function() {
                $('#dropdown1').change(function() {
                    var selectedValue = $(this).val();
                invokeForJson($('form')[0], 'populateDropDownList', '#dropdown2');
                });         
        });

    </script>
</head>
<body>

<stripes:form beanclass="com.rajamma.dealmeister.web.actions.DropDownActionBean">
    <stripes:select  id="dropdown1" name="selectHabitat">
          <c:forEach var="item" items="${actionBean.habitatList}">
                <option value="${item.value}">${item.label}</option>
        </c:forEach>
    </stripes:select>

    <stripes:select name="selectAnimal" id="dropdown2">
              <c:forEach var="item" items="${actionBean.animalList}">
                <option value="${item.value}">${item.label}</option>
        </c:forEach>
    </stripes:select>

    <stripes:submit name="submit"/>


</stripes:form>

</body>
</html>