动态获取下拉列表并回显

来源:互联网 发布:网络学校有哪些专业 编辑:程序博客网 时间:2024/05/13 21:39

下拉列表通过jquery ajax直接返回option html

页面:html

<script src="${request.contextPath}/js/choose.js"
type="text/javascript"></script>

<script type="text/javascript">
$(function(){
$("#select1").one("click", function(){
choose(this);
});
$("#select1").change(function(){ //下拉框改变时取得值
$("#sexId").val($(this).val());
});
});
</script>

<!-- Jquery ajax。 开始-->
<select id="select1" poperty="employeeSex" >
#if($sex.name)
<option  value="$!sex.id" selected="selected" >
$sex.name
</option>
#else
<option id="first"  value="" selected="selected">
==请选择性别==
</option>
#end
</select>
<input type="hidden" name="sexId" id="sexId" value="$!sex.id" /> 
<!-- 结束 -->

choose.js

function choose(obj){
var obj = $(obj);
var poperty = obj.attr("poperty");
$.ajax({
type:'get',//可选get
url:'ajax!getDictionaryBySn.action',//这里是接收数据的PHP程序
data:'sn='+poperty,
dataType:'html',//服务器返回的数据类型 可选XML ,Json jsonp script html text等
success:function(msg){
obj.find("option").not("#first").remove();
obj.append(msg);
},
error:function(){
alert("ajax提交失败的处理函数!");
}
});
}

selectoptions.html 

#foreach($o in $list)
<option value="$!o.id">
$!o.name
</option>
#end

原创粉丝点击