使用Jquery回调Ajax请求

时间:2012-01-08 14:58:58

标签: jquery jsp

编辑的JS文件:

风格1:

$(document).ready(function() {<br>
$("#rootFolder").change(function(){<br>
var rootFolderValue = $('#rootFolder').val();<br>
//alert (rootFolderValue);<br>
$.getJSON("getSubfolder.jsp", { foldername: rootFolderValue }, function(json) {<br>

$.each(json, function(i, option) {<br>

$('#subFolder1').append($('').val(option.Value).html(option.Text));<br>
});<br>
});<br>
});<br>

});<br>
<br>

样式2

$(document).ready(function() {<br>
$("#rootFolder").change(function(){<br>
var rootFolderValue = $('#rootFolder').val();<br>
alert (rootFolderValue);<br>
$.ajax({<br>
<br>
url: 'sample.jsp',<br>
data:'foldername='+rootFolderValue,<br>
dataType: "json",<br>
success:function(data){<br>
    $.each(data , function (key , value) {<br>
        $('#subFolder').append('<option value="'+key+'">"'+value+'"</option>');<br>
     });<br>
}<br>
});<br>
});<br>
});<br>

getSubfolder.jsp文件

<%<br>
    String root = request.getParameter("foldername");<br>
    System.out.println("the value is "+root);<br>
    JSONObject arrayObj=new JSONObject();<br>
    String path = "G:\\Demo\\"+root;<br>
    File rootFile = new File(path);<br>
    File[] listOfDirs = rootFile.listFiles();<br>
     for (int i = 0; i < listOfDirs.length; i++)<br>
    {        <br>
    if (listOfDirs[i].isDirectory())<br>
    {<br>
       arrayObj.put(i,listOfDirs[i].getName().toString());<br>

    }<br>
    }<br>
    out.println(arrayObj);<br>
%><br>

问题:
1)我的arrayObj具有值{“0”:“A”,“1”:“B”}。但下降仍未改变。请帮助..我已经尝试了下面提到的两种方法来改变下拉列表..整天坚持下去:)

2 个答案:

答案 0 :(得分:1)

由于datatypejsoneach functionkeyvalue作为params返回,您可以按照以下方式使用option。您可以根据success:function(data){ $.each(data , function (key , value) { $('#subFolder').append('<option value="'+key+'">"'+value+'"</option>'); }); } 代码

中的要求使用值和键
{{1}}

答案 1 :(得分:0)

datatype定义为JSON时,需要确保渲染JSON。我不确定是否只使用out.println会这样做。

假设它输出格式正确的JSON,看起来像

["option1", "option2", ... ] // or
[{"Value":"val1","Text":"text1"}, { ... }, ...]

您可以使用以下jQuery快捷方式通过AJAX请求数据并解析JSON。这是一个非常简洁的清洁解决方案,可以很好地使用API​​!

$.getJSON("getsubfolder.jsp", { foldername: rootFolderValue }, function(json) {

  $.each(json, function(i, option) {

    $('#subFolder').append($('<option />').val(option.Value).html(option.Text));

  });

});