使用ajax调用将项目填充到下拉列表并分配所选值

时间:2014-05-09 19:48:59

标签: jquery jquery-mobile drop-down-menu selected

请参阅下面的代码

$(document).ready(function () {
    readddl().done(function () {
        $('#ddlAreas').val("51");
    });

    $("#plusBtn").bind("vclick", function () {
        $('#ddlAreas').val("51");
    });
});

function readddl() {
    var df = $.Deferred();
    var stateID = 18;
    var dropdwonlist = $('#ddlAreas');
    dropdwonlist.empty();
    dropdwonlist.append($('<option></option>').val("--").html("Select Area"));

    if (stateID != undefined && stateID != "--") {
        // Send an AJAX request
        $.getJSON(Config.Url + "Area?status=A&&stateID=" + stateID)
            .done(function (data) {
            // On success, 'data' contains a list of products.
            $.each(data, function (index, item) {
                // Add a list item for the product.
                dropdwonlist.append($('<option></option>').val(item.AREA_ID).html(item.AREA_NAME));

            });
        }).fail(function (d) {
            alert(d);
        })

    }
    return df.promise();
}

我可以将项目填充到下拉列表中。但我无法将选定的值设置为下拉列表。我也尝试通过单击加号按钮来设置所选值,它可以正常工作

请指导我解决方案。感谢

1 个答案:

答案 0 :(得分:1)

使用val()时,jQuery不会触发更改事件,因此您必须自己执行以使更改生效:

dropdwonlist.val(item.AREA_ID).change();

dropdwonlist.val(item.AREA_ID).trigger('change');