STRUTS2とAJAX - 国を選択し、州を入力してください

Question

国を選択した後に州を表示したいと思います。

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：

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

STRUTS.XML

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

Actionクラス

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を使ってどのように動作させることができますか？

Answer 1

struts2-json-pluginを参照してください。あなたのアクションが（このプラグインを介して）json結果型を返すようにしてください。あなたのアクションクラスは、ほとんど変更されずに残ることができます。

アクションがJSONを返すように作成してテストしたら（ブラウザにURLを入力するだけです）次に、いくつかのJavaScriptが必要です。私はあなたがjQuerys $ .ajaxメソッドを使っているのを見ています...私は$.getJSONが同じですが、json形式のデータを前提としています。ここで

私自身のコードからいくつかのjsです：

  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; 
      } 

あなたは3つのパラメータを気づくでしょう：拳は常に最高sturts2のURLのタグで構成されているコールのURLであること。 2番目はアクションに送られるパラメータです。この場合、「バッジ」はID「input_badge」のテキストフィールドに設定され、サーバーに送信されます。最後に、コールバックが成功したときに呼び出される関数では、 "name"、 "punch"などのパラメータが返されます。