我在文本框上使用Javascript来搜索我的asp.net下拉列表中的项目。它的工作原理但问题是当找到一个项目并在下拉列表中显示时,点击后它不会触发SelectedIndexchange。为什么?
当我在多个项目中选择一个项目但是当单个项目出现并且我点击时没有点火时,它会触发。
代码:
<script type="text/javascript">
var ddlText, ddlValue, ddl, lblMesg;
function CacheItems() {
ddlText = new Array();
ddlValue = new Array();
ddl = document.getElementById("<%=ddlEmployers.ClientID %>");
//lblMesg = document.getElementById("<%=lblMsg.ClientID%>");
for (var i = 0; i < ddl.options.length; i++) {
ddlText[ddlText.length] = ddl.options[i].text;
ddlValue[ddlValue.length] = ddl.options[i].value;
}
}
window.onload = CacheItems;
function FilterItems(value) {
ddl.options.length = 0;
for (var i = 0; i < ddlText.length; i++) {
if (ddlText[i].toLowerCase().indexOf(value) != -1) {
AddItem(ddlText[i], ddlValue[i]);
}
}
lblMesg.innerHTML = ddl.options.length + " items found.";
if (ddl.options.length == 0) {
AddItem("No items found.", "");
}
}
function AddItem(text, value) {
var opt = document.createElement("option");
opt.text = text;
opt.value = value;
ddl.options.add(opt);
}
</script>
控制:
<div class="col-md-6">
<div class="form-group">
<%--<label for="exampleInputEmail1">Employers</label>--%>
<asp:TextBox ID="txtSearch" CssClass="col-md-12" runat="server" placeholder="Search employer"
onkeyup="FilterItems(this.value)"></asp:TextBox><br />
<asp:DropDownList ID="ddlEmployers" AutoPostBack="true" OnSelectedIndexChanged="ddlEmployers_SelectedIndexChanged" runat="server" CssClass="form-control"></asp:DropDownList>
<br />
<asp:Label ID="lblMsg" runat="server" Text=""></asp:Label>
</div>
</div>
SelectedIndexChanged代码:
protected void ddlEmployers_SelectedIndexChanged(object sender, EventArgs e)
{
try
{
ClsEmployee ClsEmployee = new MemberShip.Repository.ClsEmployee();
if(ddlEmployers.SelectedValue.ToInt32() <= 0)
{
ddlBranches.SelectedValue = "0";
}
else
{
ddlBranches.SelectedValue = ClsEmployeer.GetBranchByEmployerID(ddlEmployers.SelectedValue.ToInt32()) > 0 ? ClsEmployeer.GetBranchByEmployerID(ddlEmployers.SelectedValue.ToInt32()).ToString() : "0";
}
}
catch (Exception ex)
{
ScriptManager.RegisterStartupScript(this, GetType(), "showalert", "alert(" + ex.Message + ");", true);
}
}
答案 0 :(得分:0)
过滤后已设置单个选项时,索引不会发生变化。单击它时,它不符合 OnSelectedIndexChanged 的优点。
您可以按照以下编辑代码来验证我的上述声明,
function AddItem(text, value) {
var opt = document.createElement("option");
opt.text = text;
opt.value = value;
ddl.options.add(opt);
ddl.value = "";
}
但是这样做会清除过滤时的下拉列表。
或者你可以在FilterItems函数中有一个默认选项,
function FilterItems(value) {
ddl.options.length = 0;
AddItem("--Please Select--", -1);
for (var i = 0; i < ddlText.length; i++) {
if (ddlText[i].toLowerCase().indexOf(value) != -1) {
AddItem(ddlText[i], ddlValue[i]);
}
}
lblMesg.innerHTML = ddl.options.length + " items found.";
if (ddl.options.length == 0) {
AddItem("No items found.", "");
}
}
希望这有帮助!