我有一个下拉列表,显示我在Active Directory中搜索用户的时间。我使用JQuery UI自动完成功能,但在列表中的4个用户之后,背景颜色会发生变化。 所以这是我的表单,输入自动完成:
<div class="ui-widget">
<form class="form-inline" method="post" action="~/Home/SearchUserResult">
<label class="sr-only" for="inlineFormInput">
Nom et/ou Prénom
</label>
<input type="text" class="form-control mb-2 mr-sm-2 mb-sm-0" name="searchName" id="searchName" placeholder="Nom et/ou prénom" />
<img src="~/Content/Images/hourglass.gif" style="display:none" id="loadingImg"/>
<button class="btn btn-primary" type="submit" id="searchValidate"> Rechercher </button><br />
</form>
</div>
现在我的jquery脚本:
<script>
$(document).ready(function () {
var distName = [];
var dispName = [];
$("#searchName").autocomplete({
source: function (request, response) {
$("#loadingImg").show();
$.ajax({
url: "/Home/SearchUserWhileTyping",
type: "GET",
data: { name: $("#searchName").val() },
contentType: "application/json;charset=utf-8",
dataType: "json",
success: function (data) {
response($.map(data, function (item) {
distName[item.displayName] = item.distinguishedName;
//distName.push(item.distinguishedName);
dispName.push(item.displayName);
return {
label: item.displayName
}
}));
},
complete: function () {
$("#loadingImg").hide();
}
});
},
select: function (event, ui) {
var res;
var index = 0;
alert(ui.item.label);
$.each(dispName, function (key, value) {
if (ui.item.label == value)
res = distName[value];
});
//alert(disName.distinguishedName);
var link = '@Url.Action("ShowUserInfo", "Home", new { distinguishedName = "value"})';
link = link.replace("value", res);
window.location.href = link;
//window.location.href = Url.ActionLink("Test", "ShowUserInfo", "Home", new {distinguishedName = ui.item.distinguishedName});
},
minLength: 4
})
});
</script>
在此脚本中,我在您键入时从Active Directory检索值,我还在加载时显示图像,并添加了数组,以便我可以在单击用户时立即重定向。另外,这是我的表格看起来像的图片。谢谢你的帮助!
编辑我注意到css不会更改列表中四个名字的背景颜色。如果我在background-color:lightgrey
添加一些css,那么会发生什么:
正如您所看到的,上部没有变化,但下部已经改变。这很接近但仍然可见,所以不太好。