如何使用JQuery Post和Asp.Net WebMethod从JSON响应中获取JQuery Autocomplete JavaScript Object [英] How to get JQuery Autocomplete JavaScript Object from JSON response with JQuery Post and Asp.Net WebMethod

问题描述

我正在尝试创建JQuery AutoComplete，其中源对象将从数据库获取。

我使用了JQuery $ Ajax和ASP.NET WebService.I已在firebug控制台中检查它返回JSON对象但我无法从中获取JavaScript对象。



我的Web服务功能

I am trying to create JQuery AutoComplete,where source object will be get from database.
I have using JQuery $Ajax and ASP.NET WebService.I have checked in firebug console it returns JSON object but I cant get JavaScript Object from that.

My WebService Function

[WebMethod]
       [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
       public ArrayList GetClientStuffAndAdmin( int StuffID )
       {
           var MailToList = new ArrayList();
           var db = new WooskieDBInstance().WooskieDB;
           (from e in db.EMPLOYEEs
            join ept in db.EMPLOYEE_PROJECT_TASKs
            on e.ID equals ept.EMPLOYEE_ID
            where ept.CLIENT_ID.Equals(StuffID)
            select new  LookupEmployee
            {
                ID = e.Person.ID,
                Name = e.Person.DISPLAYNAME,
                PersonType = e.Person.PersonType.PersonTypeName,
                PersonTypeID = e.Person.PERSONTYPEID
            }).Concat(
                  from admin in db.Persons
                  where admin.PERSONTYPEID.Equals(1)
                  select new  LookupEmployee
                  {
                      ID = admin.ID,
                      Name = admin.DISPLAYNAME ,
                      PersonType=admin.PersonType.PersonTypeName,
                      PersonTypeID=admin.PERSONTYPEID
                  }).DefaultIfEmpty()
                  .ToList()
                  .ForEach(item =>
                  {
                      MailToList.Add(item);
                  });
            return MailToList;
       }

Javascript

Javascript

$(function () {




    $("#txtTo").autocomplete({
       source: function (request, response) {
           $.ajax({
              url: "/StuffProfile.asmx/GetClientStuffAndAdmin",
              data: JSON.stringify({ "StuffID": clientId }),
              dataType: "jsonp",
               type: "POST",
               contentType: "application/json; charset=utf-8",
               async: true,
                cache: false,
               success: function (msg) {
                    response($.map(msg.d, function (item) {
                       console.log({ ID: item.ID, Name: item.Name });
                       return { ID: item.ID, Name: item.Name };
                    }));
                }
           });
      },
        focus: function (event, ui) {
            console.log(ui);
           $("#txtTo").val(ui.item.Name);
            console.log(ui.item.Name);
            return false;
      },
        select: function (event, ui) {
            $("#txtTo").val(ui.item.Name);
           $("#stuff-id").val(ui.item.ID);
           console.log(ui.item);


            return false;
       }

    }).data("autocomplete")._renderItem = function (ul, item) {
        return $("<li>")
           .data("item.autocomplete", item)
           .append("<a>" + item.name + "</a>")
            .appendTo(ul);
        console.log(ui.item);
    };
});

$ .ajax POST保留JSON但我的自动完成功能无效。它返回

$.ajax POST retain JSON but My autocomplete is not working.It returns

{"d":[{"ID":2,"Name":"Bill","PersonType":"Employee","PersonTypeID":3},{"ID":6,"Name":"Jasson","PersonType":"Employee","PersonTypeID":3},{"ID":5,"Name":"Gissel","PersonType":"Employee","PersonTypeID":3},{"ID":2,"Name":"Bill","PersonType":"Employee","PersonTypeID":3},{"ID":1,"Name":"Ashal","PersonType":"Admin","PersonTypeID":1}]}

JSON

JSON

d
[Object {ID=2, Name="Bill", PersonType="Employee", ...}, Object {ID=6, Name="Jasson", PersonType="Employee", ...}, Object {ID=5, Name="Gissel", PersonType="Employee", ...}, 2 more...]
0
Object {ID=2, Name="Bill", PersonType="Employee", ...}
1
Object {ID=6, Name="Jasson", PersonType="Employee", ...}
2
Object {ID=5, Name="Gissel", PersonType="Employee", ...}
3
Object {ID=2, Name="Bill", PersonType="Employee", ...}
4
Object {ID=1, Name="Ashal", PersonType="Admin", ...}

请帮我解决这个问题。

Please help me what is wrong with this.

推荐答案

Ajax和ASP.NET WebService.I有chec在firebug控制台中，它返回JSON对象，但我无法从中获取JavaScript对象。



我的WebService函数

Ajax and ASP.NET WebService.I have checked in firebug console it returns JSON object but I cant get JavaScript Object from that.

My WebService Function

[WebMethod]
       [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
       public ArrayList GetClientStuffAndAdmin( int StuffID )
       {
           var MailToList = new ArrayList();
           var db = new WooskieDBInstance().WooskieDB;
           (from e in db.EMPLOYEEs
            join ept in db.EMPLOYEE_PROJECT_TASKs
            on e.ID equals ept.EMPLOYEE_ID
            where ept.CLIENT_ID.Equals(StuffID)
            select new  LookupEmployee
            {
                ID = e.Person.ID,
                Name = e.Person.DISPLAYNAME,
                PersonType = e.Person.PersonType.PersonTypeName,
                PersonTypeID = e.Person.PERSONTYPEID
            }).Concat(
                  from admin in db.Persons
                  where admin.PERSONTYPEID.Equals(1)
                  select new  LookupEmployee
                  {
                      ID = admin.ID,
                      Name = admin.DISPLAYNAME ,
                      PersonType=admin.PersonType.PersonTypeName,
                      PersonTypeID=admin.PERSONTYPEID
                  }).DefaultIfEmpty()
                  .ToList()
                  .ForEach(item =>
                  {
                      MailToList.Add(item);
                  });
            return MailToList;
       }

Javascript

Javascript

（ function （）{

（ #txtTo）。autocomplete（{
source： function （request） ，响应）{

("#txtTo").autocomplete({ source: function (request, response) {

这篇关于如何使用JQuery Post和Asp.Net WebMethod从JSON响应中获取JQuery Autocomplete JavaScript Object的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！