ajax传值写下拉框,使用jquery的ajax方法获取下拉列表值

AJAX 是一种用于创建快速动态网页的技术。

通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新,用户体验非常好。

下面介绍两种动态加载DropDownList值的方法。

第一种：

View层

$(document).ready(function() {

showFuncId();

}

function showFuncId(){

$(‘#funcNum‘).empty();

var ciValue = $(‘#funcNum‘);

ciValue.append(‘Pls Select‘);

$.ajax({

url : u, //your actual url

type : ‘post‘,

dataType : ‘json‘,

success : function (opts) {

if (opts && opts.length > 0) {

var html = [];

for (var i = 0; i < opts.length; i++) {

html.push(‘‘+opts[i].desc+‘‘);

}

ciValue.append(html.join(‘‘));

}

}

});

}

Controller层

response.setContentType("application/json");

response.setCharacterEncoding("utf-8");

PrintWriter writer = response.getWriter();

net.sf.json.JSONArray array = JSONArray.fromObject(new ArrayList());//The list that contains actual data,use a new arrayList instead here

writer.append(array.toString());

return null;

第二种：

View层

$(function(){

$.ajax({

type: ‘POST‘,

url:url;//your actual url

dataType: ‘json‘,

cache: false,

async:false,

success:function(data) {

$(‘#funcNum‘).get(0).options.length = 0;

$(‘#funcNum‘).append(‘Pls Select‘);

$.each(data, function(i, obj) {

var option = $(‘‘);

option.val(obj.id);

option.text(obj.desc);

$(‘#funcNum‘).append(option);

});

},

error: function() {

alert("Error while getting vehicle type results");

}

});

});

Controller层

response.setContentType("application/json");

response.setCharacterEncoding("utf-8");

PrintWriter writer = response.getWriter();

net.sf.json.JSONArray array = JSONArray.fromObject(new ArrayList());//The list that contains actual data,use a new arrayList instead here

writer.append(array.toString());

return null;