jquery autocomplete 如何实现key与value同时返回

liaofeifan

jquery autocomplete 如何实现key与value同时返回。即key写入hidden控件，value在textbox控件显示。

liaofeifan

服务器端：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Script.Services;
using System.Web.Services;
using EF.BLL;
using EF.DAL;

namespace EF.APP
{
    /// <summary>
    /// SearchTeachingClass 的摘要说明
    /// </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 SearchTeachingClassService : System.Web.Services.WebService
    {

        [WebMethod]
        public string HelloWorld()
        {
            return "Hello World";
        }
        /// <summary>
        /// 主要是这个方法就是查询数据变为一个字符数组。
        /// </summary>
        /// <param name="q"></param>
        /// <returns></returns>
        [WebMethod]
        [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
        public string[] GetData(string q)
        {
            var s = q.Split('#')[0].ToUpper();
            var semesterID = Convert.ToInt32(q.Split('#')[1]);
            var data = new List<string>();
            var db = new EFSystemDataEntities();
            using (var teachingClassBll = new TeachingClassBll(db))
            {
                var query =
                    teachingClassBll.Filter(
                        c =>(c.SemesterID==semesterID)&&(c.ClassCode.Contains(s) || c.ClassName.Contains(s) || c.ClassNamePY.Contains(s))).Take(20);
                foreach (var teachingClass in query)
                {
                    data.Add(string.Format("{0}#{1}", teachingClass.ClassName, teachingClass.ID));
                }
            }
            return data.ToArray();
        }
    }

}
客户端：
Ext.onReady(function () {
            var selid = $("#<%=HiddenFieldSemeter.ClientID %>").val();//为了给后台传入一个查询参数
            $("#<%=txtTeachingClass.ClientID %>").autocomplete({
                source: function (request, response) {
                    $.ajax({
                        url: '<%=ResolveUrl("~/ClassWorkLoad/SearchTeachingClassService.asmx/GetData") %>',
                        data: "{ 'q': '" + request.term + "#" + selid + "'}",
                        dataType: "json",
                        type: "POST",
                        contentType: "application/json; charset=utf-8",
                        success: function (data) {
                            response($.map(data.d, function (item) {
                                return {
                                    label: item.split('#')[0],
                                    val: item.split('#')[1]
                                }
                            }))
                        },
                        error: function (response) {
                            alert(response.responseText);
                        },
                        failure: function (response) {
                            alert(response.responseText);
                        }
                    });
                },
                select: function (e, i) {
                    $("#<%=HiddenFieldTeachinClass.ClientID %>").val(i.item.val);
            },
                minLength: 1,
                extraParams: { key: function() { return $("#<%=ddlCurrentSemester.ClientID %>").val(); } }
            });

自问自答了，供参考。其实我对返回json还有点没搞懂。