ajax異步傳輸參數並回顯到option中

主要效果：province和city是一張樹形表，選擇好province後，city才顯示出所對應的數據，存入數據庫的是value並非id。

直接放重點吧：

html:

<div class="control-group">
			<label class="control-label">city：</label>
			<div class="controls">
				<form:select path="city" class="input-xlarge " id="dss">
					<form:option value="" label=""/>
					
				</form:select>
			</div>
		</div>

js

<script type="text/javascript">
		var name = null;
        $("select#ssss").change(function(){
            name = $(this).val();
            $.ajax({
                type:"POST",
                async:true,  //異步
				dataType:"json",
                url: "${ctx}/qiwen/testcp/qiwenTestCp/city",    //url地址
                data:{"name":name},
                success : function (data) {   //請求成功時的返回函數
                   var list =  JSON.stringify(data);
					$("#ss").val(list);
                    var $select = $('#dss');
                    for(var i=0; i < data.length;i<i++){
                        $select.append('<option value="'+data[i]['name']+'">'+data[i]['name']+'</option>');
                    }

                }
            });
         });

	</script>

controller:

@RequiresPermissions("User")
	@ResponseBody
	@RequestMapping(value = "city")
	public List<QiwenCity> city(Model model,String name,HttpServletResponse response){
		List<QiwenCity> listCitychild = qiwenTestCpService.findCityChild("3",name);
		
		return listCitychild;
	}

爲了防止option重複，顯示出來的數據不更新，在jqeury中添加：

$("#citySelect").empty();
$("#sa span").each(function(){
    $(this).text('');
});