STRUTS2和AJAX - 选择国家,填充国国家、AJAX

2023-09-10 20:01:35 作者:酷似你爹

我要选择国家后,显示的状态。

I want to show the states after selecting the country.

JSP

       <s:select label="COUNTRY" name="summaryData.addressCountry" id="addForm_countryCode" 
                                      list="loyaltyCountryMap" tabindex="" headerKey="US" headerValue="United States"
                                      listKey="key" listValue="value.countryName" 
                                      onchange="getStateList('#addForm_countryCode')">

       </s:select> 

<s:select label="STATE" name="summaryData.addressCityCode" headerValue="-Select-" headerKey="-Select-" list="stateList" required="true" cssClass="storedPaymentInput_size1 required" id="stateList"/>

JavaScript的:

JAVASCRIPT:

  function getStateList() {
        var countryCode = $('#addForm_countryCode").val(); 
        $.ajax({
            url: 'ajaxStateList',
            dataType: 'html',
            data: { countryCode : countryCode},
            success: function(data) {
                $('#stateList').html( data );
            }
        });
    }

在struts.xml

STRUTS.XML

     <action name="ajaxStateList" class="actions.AjaxStateList">
       <result name="success"/>
 </action>

Action类

ACTION CLASS

 private List<String> stateList;

    private String countryCode;

    public String getCountryCode() {
        return countryCode;
    }

    public void setCountryCode(String countryCode) {
        this.countryCode = countryCode;
    }

    public List<String> getStateList() {
        return stateList;
    }

    public void setStateList(List<String> stateList) {
        this.stateList = stateList;
    }

    public String execute() {

        LoyaltyStateProvinces.getInstance();

        stateList = StateProvinces.getAllStateProvinceByCountryCode(countryCode);

        for(StateProvince state: states){
            stateList.add(state.getStateProvinceCode());
        }


        return SUCCESS;
    }

如何才能使它工作使用AJAX + Struts2的?

How can I make it work using AJAX+Struts2?

推荐答案

请参阅 struts2的-json-插件。有你的行动返回一个JSON的结果类型(通过这个插件)。 Action类可以在很大程度上仍然不变。

See struts2-json-plugin. Have your actions return a json result type (via this plugin). Your action class can remain largely unmodified.

一旦你已经创建并测试您的操作返回JSON(只需输入网址浏览器)。然后,你需要一些JavaScript。我看你使用的是jQuerys $阿贾克斯的方法......我preFER的 $ .getJSON 这不相同,但假设在一个JSON格式的数据。

Once you have created and tested that your action returns JSON (just enter the url in your browser). Then you need some javaScript. I see you are using jQuerys $.ajax method... I prefer the $.getJSON which does the same but assumes the data in a json format.

下面是我自己的code一些JS:

Here is some js from my own code:

            function punch(){
                $.getJSON("<s:url namespace="/timeclock/json" action="punch"/>",
                {
                    badge: $("#input_badge").val()
                },
                function(data) {
                    $("#input_badge").val("");
                    $("#emp_name").text(data.name);
                    $("#emp_time").text(data.punch);
                    $("#notification").fadeIn("slow", hide);
                });
                return false;
            }

您会发现三个参数:拳头作为网址它总是最好的sturts2 URL标记构建的呼叫。第二个是该参数被发送到的动作,在这种情况下,标记是被设定为什么都是在文本字段包含input_badge的ID,然后发送到服务器。最后,这就是所谓的当回拨成功的功能,你可以看到参数,如姓名,冲返回。

You'll notice three parameters: Fist being the url for the call which is always best constructed with the sturts2 url tag. Second being the parameters being sent to the action, in this case "badge" is set to what ever was in the text field with the id of "input_badge" and then sent to the server. Finally the function which is called when the call back succeeds, you can see parameters such as "name", "punch" are returned.

 
精彩推荐
图片推荐