structs 2注記+jsp+ajax post非同期ロードselectを実現
2865 ワード
プロセス:
1.btnの読み込みをクリックして非同期リクエストpostを開始
2.バックグラウンド処理要求返却データ
3.フロントエンドのデータ取得に成功し、データの処理を行う
フロントエンド:
html:まずjqパッケージをインポートします.そうしないとajaxはどう使いますか.
バックグラウンドstructs:
注記を使用して実装し、
クラスを宣言するときは注記:@ParentPackage("json-default")
メソッド宣言注記:@Action(value=「xxxx」、results=@Result(name=「success」、type=「json」)
ページをジャンプする必要がある場合はtype=「json」をlocation=「/mobile/auction_detailed.jsp」ジャンプするページに変更します
ヒントはjqueryです.js v1.4.1の、minを使うのはjsonを返すようでobjを返すのではありません
1.btnの読み込みをクリックして非同期リクエストpostを開始
2.バックグラウンド処理要求返却データ
3.フロントエンドのデータ取得に成功し、データの処理を行う
フロントエンド:
html:まずjqパッケージをインポートします.そうしないとajaxはどう使いますか.
<script type="text/javascript" src="js/jquery.js"></script>
<select name="warId" id="warId" style="height:100%;width:107px">
<option value=""> </option>
</select>
<script type="text/javascript">
$(document).ready(function(){ // : class add button
$(".add").click(function(){
$.post("xxxx.do",function(data){ // action,
var objs = data.warehouses; // action
var selObj = $("#wareId");
selObj.empty();
for (var i in objs) {
var obj = objs[i];
addOption(selObj,obj.id,obj.warehouseName); // Select Option( )
}
},"json"); //
});
});
function addOption(selObj,value,text){
var optionstring = "<option value=\"" + value + "\" >"+ text + "</option>";
selObj.append(optionstring); // Select Option( )
}
</script>
バックグラウンドstructs:
注記を使用して実装し、
クラスを宣言するときは注記:@ParentPackage("json-default")
メソッド宣言注記:@Action(value=「xxxx」、results=@Result(name=「success」、type=「json」)
ページをジャンプする必要がある場合はtype=「json」をlocation=「/mobile/auction_detailed.jsp」ジャンプするページに変更します
@ParentPackage("json-default")
public class WarHouseAction extends ActionSupport {
@Autowired
private WarehouseService warehouseService;
private List<Warehouse> warehouses;
/**
* ajax
* @return
* type = "json" location = "/mobile/auction_detailed.jsp"
*/
@Action(value = "addGood_before", results = @Result(name = "success", type="json"))
public String addGoodBefore(){
warehouses = warehouseService.findAllEnableWarehouses(); //
return "success";
}
public WarehouseService getWarehouseService() {
return warehouseService;
}
public void setWarehouseService(WarehouseService warehouseService) {
this.warehouseService = warehouseService;
}
public List<Warehouse> getWarehouses() {
return warehouses;
}
public void setWarehouses(List<Warehouse> warehouses) {
this.warehouses = warehouses;
}
}
ヒントはjqueryです.js v1.4.1の、minを使うのはjsonを返すようでobjを返すのではありません