添加其他选项以使用ajax进行选择

时间:2016-08-18 09:49:53

标签: javascript jquery ajax jquery-mobile

我试图在JQM中使用ajax向下拉列表中添加其他选项。第一个选项是静态禁用选定和隐藏选项。其他选项是使用ajax从Web服务中提取的。下拉列表本身位于弹出窗口中。

这是我的代码:

<div data-role="popup" id="puIceCream"><div>
     <center>Select Flavor:</center>
     <select id="ddlFlavorsIC">
        <option value="" disabled selected hidden>Please Choose...</option>
         <!--Flavors are added here-->
     </select>
</div>

JS代码如下:

$("#puIceCream").on("popupafteropen", function (event) {
    if (!$("#ddlFlavorsIC option").length) {
        WebServiceURL = "IceWS.asmx";
        $.support.cors = true;
        $.ajax({
            url: WebServiceURL + "/GetFlavors",
            dataType: "json",
            type: "get",
            data: "{ }",
            contentType: "application/json; charset=utf-8",
            error: function (err) {
                alert("error: " + JSON.stringify(err));
            },
            success: function (data) {
                var size = data["d"].length;
                for (var i = 0 ; i < size; i++) {
                    $("#ddlFlavorsIC").append("<option>" + ((String)(data["d"][i].value)) + "</option>");
                }
            }
        });
    }
});

如果我删除标记上的静态隐藏选项,它可以正常工作,但由于某种原因它不能使用它。那是为什么?

提前致谢!

1 个答案:

答案 0 :(得分:0)

更改

if (!$("#ddlFlavorsIC option").length) {

if ($("#ddlFlavorsIC option").length < 2){

如果下拉列表中没有选项,您的代码只会添加一些风格,因此您的一个静态选项会导致您不能输入IF语句。

DEMO