Jquery Chosen - 选择在单击下拉列表之前出现

时间:2013-12-13 16:11:58

标签: javascript jquery ajax

我刚开始在我的网站上使用JQuery Chosen。在$(document).ready中为2个下拉列表调用.chosen()之后,我收到了这个输出:

https://www.mediafire.com/?3ld9sw734582usf

我使用ajax将数据推送到2个下拉列表。我是这样做的:

$.ajax({
    type: "GET",
    cache: false,
    url: "/ServiceLocation/ShowServices",
    beforeSend: function() {
        $('#ddlSer').chosen();
    },
    success: function (data) {
        $('#ddlSer').empty();

        $.each(data, function(idx, elem) {
            var serv = service.replace("[SERVICE]", elem.ServiceName);
            serv = serv.replace("[SERVICEID]", elem.ServiceId);

            $('#ddlSer').append(serv);
        });

        $('#ddlSer').trigger('liszt:updated');
    },
    error: function () {
        alert('Could not get the list of services.');

        return false;
    }
});

$.ajax({
    type: "GET",
    cache: false,
    url: "/ServiceLocation/ShowLocations",
    beforeSend: function () {
        $('#ddlLoc').chosen();
    },
    success: function (data) {
        $('#ddlLoc').empty();

        $.each(data, function(idx, elem) {
            var loc = locat.replace("[LOCNAME]", elem.LocationName);
            loc = loc.replace("[LOCID]", elem.LocationId);

            $('#ddlLoc').append(loc);
        });

        $('#ddlLoc').trigger('liszt:updated');
    },
    error: function () {
        alert('Could not get the list of locations.');

        return false;
    }
});

以下是我用于将数据附加到下拉列表的2个变量:

var service = "<option value='[SERVICEID]'>[SERVICE]</option>";
var locat = "<option value='[LOCID]'>[LOCNAME]</option>";

我做了什么使得2 Chosen下拉列表看起来像那样难看? 感谢您的帮助。提前谢谢!

P / S:我在将数据推送到下拉列表后尝试使用Chosen。它既不起作用也不起作用。

编辑:

我使用了selected.css和我的自定义。这是我的自定义CSS中与我选择的下拉列表相关的部分:

#ddlLoc_chzn .chzn-single {
height: 35px;
line-height: 35px;
width: 200px !important;
}

#ddlLoc_chzn b {
margin-top: 5px;
}

#ddlLoc_chzn .chzn-drop {
width: 200px !important;
}

#ddlLoc_chzn .chzn-search input {
width: 190px !important;
padding-right: 0px;
padding-left: 4px;
}

0 个答案:

没有答案