Question

考虑一下：我的jQueryMobile页面有大约5个下拉列表。我们决定使用WebAPI（新手）进行数据库连接，并编写了5个相应的控制器。现在我的基本查询，是否有办法最小化这些Ajax调用以填充每个下拉列表。

现在我重复以下代码5次：

$.getJSON('http://<localhost>:63330/api/data/').done(function (data) {

    var listItems = "";
    for (var i = 0; i < data.length; i++) {
        alert(data[i]);
        listItems += "<option value='" + i + "'>" + data[i] + "</option>";
    }
    $("#ddlDCName").html(listItems);
    })
    .error(function (XMLHttpRequest, textStatus, errorThrown) {
        alert("error: " + XMLHttpRequest.responseText);
    });

Answer 1

因为您希望填充所有下拉菜单。在一个ajax调用中执行此操作会更好。多个ajax调用会使事情变得非常糟糕。

不是调用不同的控制器而是让一个控制器立即向您发送所有数据？一旦你有数据过滤器通过它并将其附加到相应的下拉列表。

Answer 2

简单地将其作为一种功能

var getJSONForDropdown = function(url,elementId){
    $.getJSON(url).done(function (data) {
                var listItems = "";
                for (var i = 0; i < data.length; i++) {
                    alert(data[i]);
                    listItems += "<option value='" + i + "'>" + data[i] + "</option>";
                }
                $(elementId).html(listItems);
            })
           .error(function (XMLHttpRequest, textStatus, errorThrown) {
                  alert("error: " + XMLHttpRequest.responseText);
            });
}

然后使用您选择的不同url和elementId调用它。

getJSONForDropdown('http://<localhost>:63330/api/data/',"#ddlDCName");

希望这会有所帮助。

从jQuery Mobile页面管理AJAX JSON Web API调用

2 个答案: