AutoCompleteExtender返回text-value键值对的变通方法

项目中遇到一个问题：有些下拉列表的项目过多，用户选择起来十分麻烦。

这使我想到了使用Ajax的AutoCompleteExtender控件替代DropDownList来解决这个问题。但是标准的AutoCompleteExtender控件只返回Text列表，我如何取得用户选择的ID呢？

 

网络上有些做法是改变AutoCompleteExtender的某些内部函数（http://www.cnblogs.com/SilverLight/archive/2008/09/28/1301755.html），但实现起来相当麻烦。最后我采用了一种变通的方法解决了此问题。其思路如下：通过AjaxControlToolkit.AutoCompleteExtender.CreateAutoCompleteItem函数设置text-value键值对，然后使用AutoCompleteExtender控件的OnClientItemSelected方法将选中项的value值存入页面中的hidden控件。

 

HTML代码如下： <asp:TextBox ID="MaterialNameTxt" runat="server" Width="350px"></asp:TextBox> <cc2:AutoCompleteExtender ID="AutoCompExt" runat="server" TargetControlID="MaterialNameTxt" MinimumPrefixLength="1" ServicePath="../../../MyWebMethods/WSMSCMap_GetMaterial.asmx" ServiceMethod="GetListName" CompletionInterval="1" CompletionListItemCssClass="autocomplete_listItem" CompletionListHighlightedItemCssClass="autocomplete_highlightedListItem" FirstRowSelected="true" Enabled="true" EnableCaching="false" CompletionListCssClass="autocomplete_list" UseContextKey="true" OnClientItemSelected="OnACEItemSelected"></cc2:AutoCompleteExtender> <input id="AutoComplete_Hidden" type="hidden" runat="server" />

JavaScript： 

<mce:script type="text/javascript"><!-- function OnACEItemSelected(source, eventArgs) { document.getElementById("AutoComplete_Hidden").value=eventArgs.get_value(); document.getElementById("MaterialIDLbl2").innerText=eventArgs.get_value(); //alert("Value值："+eventArgs.get_value()+"/nText值："+eventArgs.get_text()); } // --></mce:script>

CS代码：

/// <summary> /// AutoCompleteExtender搜索显示结果集的ServiceMethod /// </summary> /// <param name="prefixText">输入的文本，根据这个和数据库进行匹配</param> /// <param name="count">返回的结果集的长度</param> /// <param name="contextKey">AutoCompleteExtender.ContextKey的值，在调用本方法之前可以将其设置为用户的自定义值。重载函数中没有此项参数</param> /// <returns></returns> [WebMethod] public string[] GetListName(string prefixText, int count, string contextKey) { List<string> items = new List<string>(count); string SelectText = ""; int rowCount = -1; DataTable dtt = new DataTable(); if (string.IsNullOrEmpty(contextKey)) SelectText = "select MaterialID,MaterialName from Admin.BD_TechnicalStandard where MaterialName like '" + prefixText + "%' order by nlssort(MaterialName,'NLS_SORT=SCHINESE_PINYIN_M')"; else SelectText = "select MaterialID,MaterialName from Admin.BD_TechnicalStandard where MaterialName like '%" + prefixText + "%' and MaterialID NOT IN (select distinct MaterialID from Admin.BD_MSCMap) order by nlssort(MaterialName,'NLS_SORT=SCHINESE_PINYIN_M')";//contextKey: Remove //SelectText = "select * from (" + SelectText + ") where rownum<=" + count.ToString() + " order by rownum ASC";//抽取前count个结果 dtt = moc.ExecSelectCommand(SelectText, out rowCount); if (dtt != null && rowCount > 0) { //使用text-value键值对：AjaxControlToolkit.AutoCompleteExtender.CreateAutoCompleteItem函数 foreach (DataRow dr in dtt.Rows) items.Add(AjaxControlToolkit.AutoCompleteExtender.CreateAutoCompleteItem(dr["MaterialName"].ToString(), dr["MaterialID"].ToString())); return items.ToArray(); } else return null; }