asp.net添加搜索多个dropdownlist

为了在下拉列表中搜索，我遵循了这一点。它很好用

但是，当我在同一页面中添加另一个dropdownlist并使用相同的策略时，其中只有一个可以正常工作

为两个下拉列表添加两个搜索的正确方法是什么

下面是javascript代码：

 <script type="text/javascript">
     var ddlText, ddlValue, ddl, lblMesg, ddlText1, ddlValue1, ddl1, lblMesg1;
     function CacheItems() {
         ddlText = new Array();
         ddlValue = new Array();
         ddl = document.getElementById("<%=ddlActivities.ClientID %>");
        lblMesg = document.getElementById("<%=lblMessage.ClientID%>");
        for (var i = 0; i < ddl.options.length; i++) {
            ddlText[ddlText.length] = ddl.options[i].text;
            ddlValue[ddlValue.length] = ddl.options[i].value;
        }

        ddlText1 = new Array();
        ddlValue1 = new Array();
        ddl1 = document.getElementById("<%=ddlParicipent.ClientID %>");
        lblMesg1 = document.getElementById("<%=lblMessageParticipant.ClientID%>");
         for (var i = 0; i < ddl1.options.length; i++) {
             ddlText1[ddlText1.length] = ddl1.options[i].text;
             ddlValue1[ddlValue1.length] = ddl1.options[i].value;
         }
    }
    window.onload = CacheItems;

    function Filter(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);
    }

    function FilterParticipant(value) {
        ddl1.options.length = 0;
        for (var i = 0; i < ddlText1.length; i++) {
            if (ddlText1[i].toLowerCase().indexOf(value) != -1) {
                AddItem1(ddlText1[i], ddlValue1[i]);
            }
        }
        lblMesg1.innerHTML = ddl1.options.length + " items found.";
        if (ddl1.options.length == 0) {
            AddItem1("No items found.", "");
        }
    }

    function AddItem1(text, value) {
        var opt1 = document.createElement("option");
        opt1.text = text;
        opt1.value = value;
        ddl1.options.add(opt1);
    }
</script>

变量ddlText、ddlValue、ddl、lblMesg、ddlText1、ddlValue1、ddl1、lblMesg1；
函数CacheItems（）{
ddlText=新数组（）；
ddlValue=新数组（）；
ddl=document.getElementById（“”）；
lblMesg=document.getElementById（“”）；
对于（变量i=0；i

和HTML脚本：

<div class="editor-field">
            <asp:TextBox ID="txtSearch" runat="server"
                onkeyup="Filter(this.value)"></asp:TextBox><br />
            <asp:DropDownList ID="ddlActivities" runat="server" AutoPostBack="True" DataSourceID="SqlActivities" DataTextField="Name" DataValueField="ID" OnDataBound="ddlActivities_DataBound"></asp:DropDownList>
            <br />
            <asp:Label ID="lblMessage" runat="server" Text=""></asp:Label>
        </div><div class="editor-field">
                <asp:TextBox ID="TextBox1" runat="server"
                    onkeyup="FilterParticipant(this.value)"></asp:TextBox><br />
                <asp:DropDownList ID="ddlParicipent" runat="server" AutoPostBack="True" DataSourceID="sqlParticipent" DataTextField="Name" DataValueField="ID" OnDataBound="ddlParicipent_DataBound">
                </asp:DropDownList>
                <br />
                <asp:Label ID="lblMessageParticipant" runat="server" Text=""></asp:Label>
            </div>

---

谢谢

正如我们在评论中所讨论的，您的问题很可能会发生，因为当您的第一个面板被隐藏时，javascript中的第一个

文档。getElementById

调用将返回null

如果你试图对结果做些什么，你会得到一个错误——第二个下拉搜索将永远不会被设置

有几种方法可以实现这一点，使其更加健壮（并使其成为您可以在其他页面上使用的东西，而无需为每个下拉列表重复代码），但最简单的方法可能是：

    ddlText = new Array();
    ddlValue = new Array(); 
    ddl = document.getElementById("<%=ddlActivities.ClientID %>");
    lblMesg = document.getElementById("<%=lblMessage.ClientID%>");
    if(ddl != null && lblMesg != null)  // <-- new code
    {
        for (var i = 0; i < ddl.options.length; i++) {
           ddlText[ddlText.length] = ddl.options[i].text;
           ddlValue[ddlValue.length] = ddl.options[i].value;
        }
    } 
    ddlText1 = new Array();
    ddlValue1 = new Array();
    ddl1 = document.getElementById("<%=ddlParicipent.ClientID %>");
    lblMesg1 = document.getElementById("<%=lblMessageParticipant.ClientID%>");
    if(ddl1 != null && lblMesg1 != null) // <-- new code
    {
         for (var i = 0; i < ddl1.options.length; i++) {
             ddlText1[ddlText1.length] = ddl1.options[i].text;
             ddlValue1[ddlValue1.length] = ddl1.options[i].value;
         }
    }

ddlText=newarray（）；
ddlValue=新数组（）；
ddl=document.getElementById（“”）；
lblMesg=document.getElementById（“”）；
如果（ddl！=null&&lblMesg！=null）//您正在为所有下拉列表执行CacheItems函数，请共享您的代码。@Sami我更新了我的问题。看起来没问题，您是否可以共享下拉列表HTML？@Sami当然，请再次检查问题当您说“只有一个可以正常工作”时，您的意思是一个可以工作，另一个不行吗？如果是，哪一个有效，哪一个无效？还是轮换？非常感谢