使用 ajax 和 jQuery 绑定下拉列表

Question

我想将 splunk 中的数据绑定到下拉列表。

servlet 通过 gson 返回一个 JsonString

    Gson gson = new Gson();
                    String jsonString = gson.toJson(arrays);
                    resp.getWriter().write(jsonString);

在jsp中，ajax用于取回jsonString，并在下拉列表中隐藏。

$(document).ready(function() {
    $.ajax({
            type: "POST",
            dataType : "json",
            url : "../getName",

            success : function(data) {
            console.log("success to return name");
            if (msg) {
                      alert("Somebody" + name + " was added in list !");
                      location.reload(true);
             } else {
                      alert("Cannot add to list !");
             }

             $.each(objdata["wlsDomain"], function(i, val) {
             jQuery('#DropdownList').append('<option value="' + val.name  + '</option>');
             }); 

        };
    )};     
 )];

它说 $(...).ready 不是一个函数。如果我将“$”更改为“jQuery”，则没有警告。但是，绑定失败。

然后我也尝试了下面的代码来了解 ajax 是否可行。 它显示“失败”。因此，ajax 是行不通的。

jQuery(document).ready(function() {
var promise =jQuery.ajax({
type: "POST",
url: "../getName",
dataType: "json"

});

promise.fail( function() {
window.alert("Fail!");
});

promise.done( function() {
window.alert("Success!");
});

我可以知道这有什么问题吗？ 以及如何将名称从 splunk 绑定到下拉列表？

谢谢！

Answer 1

试试下面的代码：

$(document).ready(function () {

    var $el = $('#DropdownList');
    var url = "../getName";
    $.getJSON(url, {}, function (data) {

        $el.empty(); // remove old options

        $.each(data, function(index, obj) {
            $el.append($("<option></option>")
                .attr("value", obj.name).text(obj.name));
        });
    } );

});