ajax异步百度搜索框，选择后加载数据填充文本框

[isxiaoming]

想实现，

在input1控件 点击后，异步把商品名称都显示出来，默认10条，可输入名称搜索，类似百度、google搜索框

当选择其中一条时，需把该条商品的其他属性(编码、型号... ...)，显示在input2,input3,input4...中。

可能需要2次异步加载。第一次加载商品的ID和NAME,当选中某一条的时候，在加载异步使用ID取其他属性。

不会写，有大神给个例子参考么。。。谢了。

[isxiaoming]

不要沉掉啊。。

[isxiaoming]

谁随便回复一句。我结贴

[斯洛文尼亚旅游]

随便找个autocomplete的插件来看就好了。。如jqueryui的autocomplete，自己返回相关的数据，都有事件的

[一片冰心在玉壶]

获取 值 Ajax异步去搜索 如果有就加载到一个div什么的东西里面，让他的样式现在在文本框下面 这…… 自己写一个 也不难 啊 亲

[飞猪大飞]

推荐使用 AutoCompleteExtender 的AjaxControlToolKit 控件 和百度的文本框差不多 <ajaxToolkit:ToolkitScriptManager runat="server" ID="ajaxScriptManager" EnablePartialRendering="true" CombineScripts="false"> <Services> <asp:ServiceReference Path="WebService1.svc" /> </Services> </ajaxToolkit:ToolkitScriptManager> <asp:TextBox ID="TextBox1" Width="200px" runat="server"></asp:TextBox> <ajaxToolkit:AutoCompleteExtender ID="AutoCompleteExtender1" runat="server" TargetControlID="TextBox1" MinimumPrefixLength="1" ServicePath="WebService1.asmx" ServiceMethod="GetFileCounterList" CompletionInterval="1" ShowOnlyCurrentWordInCompletionListItem="true" CompletionListCssClass="autocomplete_completionListElement" CompletionListItemCssClass="autocomplete_listItem" CompletionListHighlightedItemCssClass="autocomplete_highlightedListItem" FirstRowSelected="true" Enabled="true" DelimiterCharacters=";, :" EnableCaching="false" UseContextKey="true" OnClientItemSelected="OnACEItemSelected"> </ajaxToolkit:AutoCompleteExtender> <input id="AutoComplete_Hidden" type="hidden" runat="server" /> ------------------------------------------------------------------------------------------------------------------ WebService1 代码： /// <summary> /// WebService1 的摘要说明 /// </summary> [WebService(Namespace = "http://tempuri.org/")] [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] [System.ComponentModel.ToolboxItem(false)] // 若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务，请取消对下行的注释。 [System.Web.Script.Services.ScriptService] public class WebService1 : System.Web.Services.WebService { [WebMethod] public string HelloWorld() { return "Hello World"; } /// <summary> /// 模糊查询产品信息 /// </summary> /// <param name="prefixText">模糊搜索的条件，由三部分信息组成 cid,productcode,productname</param> /// <param name="count"></param> /// <returns></returns> [WebMethod] public string[] GetFileCounterList(string prefixText, int count, string contextKey) { string[] selectParamer = new string[3]; selectParamer[0] = contextKey; selectParamer[1] = string.Empty; selectParamer[2] = prefixText; demoDataContext context = new demoDataContext(); var FileCounter = (from t in context.FileCounter where ( //不读取已经发送的信息或者已推送过代办的 t.CounterName.Contains(selectParamer[2])) select t); try { List<string> items = new List<string>(FileCounter.Count() + 1); foreach (var item in FileCounter) { //使用text-value键值对：AjaxControlToolkit.AutoCompleteExtender.CreateAutoCompleteItem函数 items.Add(AjaxControlToolkit.AutoCompleteExtender.CreateAutoCompleteItem(item.CounterName, item.CounterID.ToString())); } return items.ToArray(); } catch (Exception) { throw; } }

[成都-狗蛋儿]

老生常谈，这种问题最好还是去参观实例 sugra

[rolandmark]

点搜索时请求一次后台，后台返回商品ID，名称；选中某一商品时把商品ID传到后台，后台根据id返回商品信息，前台接受到返回的数据显示商品信息。