Чтение данных XML из веб-службы ASMX для автозаполнения Jquery - PullRequest
3 голосов
/ 14 апреля 2011

Веб-сервисы Me и ASMX не включаются. Мы спорим. Она приводит аргументы, которые мы имели в прошлом. Это боль. Наши отношения на камнях!

У меня есть веб-сервис ASMX, который я не сериализовал с библиотекой Newtonsoft (как объяснено здесь: http://encosia.com/2011/04/13/asp-net-web-services-mistake-manual-json-serialization/). Это выглядит так:

    [WebMethod]
    [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
    public string[] GetCitiesWithState(string isoalpha2, string prefixText)
    {
        var dict = AtomicCore.CityObject.GetCitiesInCountryWithStateAutocomplete(isoalpha2, prefixText);
        string[] cities = dict.Values.ToArray();
        return cities;
    }

Достаточно просто, верно? Возвращается при поиске new:

<?xml version="1.0" encoding="utf-8"?>
<ArrayOfString xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns="http://tempuri.org/">
  <string>New Orleans, Louisiana</string>
  <string>New York, New York</string>
</ArrayOfString>

Я ожидал JSON, но после небольшого прочтения кажется, что я не должен пытаться сериализовать вывод - это должно произойти, верно? В любом случае, у меня есть следующий JQuery на внешнем интерфейсе:

$('#<%=txtCity.ClientID%>').autocomplete('<%=ResolveUrl("~/AtomicService/Assets.asmx/GetCitiesWithState")%>', {
            dataType: 'json',
            httpMethod: 'POST',
            contentType: 'application/json; charset=utf-8',
            parse: function (data) {
                var rows = new Array();
                for (var i = 0; i < data.d.length; i++) {
                    rows[i] = { data: data.d[i], value: data.d[i].Value, result: data.d[i].Value };
                }
                return rows;
            },
            formatItem: function (row, i, n) {
                return row.Value;
            },
            extraParams: {
                minChars: 2,
                isoalpha2: '<%=Session["BusinessCountry"].ToString()%>',
                maxRows: 20,
                prefixText: function () {
                    return $('#<%=txtCity.ClientID%>').val()
                }
            },
            max: 20
        }).result(function (event, data, formatted) {
            if (data) {
                alert(data['Key']);
            }
        });

Я вижу звонки, используя Chrome:

what one can see in Chrome

И все же все происходит! Нет ошибок Jquery, нет фейерверков, нет ничего. Она игнорирует меня.

Сначала я обвинял веб-сервис, но я думаю, что это может быть связано с тем, как я анализирую и форматирую данные в jquery.

Итак, у меня вопрос , что я делаю не так и как я могу правильно настроить автозаполнение?

Помощь оценена :) 1028 *

РЕДАКТИРОВАТЬ: Это может быть не полезно, но это то, что я вижу в Fiddler:

enter image description here

Ответы [ 2 ]

5 голосов
/ 14 апреля 2011

Автозаполнение пользовательского интерфейса jQuery больше не использует метод formatItem. Этот и многие другие подобные методы присутствовали в более ранней версии autocomplete, которая была плагином здесь

Я переписал ваш код с помощью автозаполнения пользовательского интерфейса jQuery, и он работает для меня с файлами htm и asmx, приведенными ниже.

Обратитесь к демонстрационным записям автозаполнения jQueryUI , чтобы узнать больше методов, которые вы можете использовать.

Я использовал json2.min.js с www.json.org Также я добавил атрибут [System.Web.Script.Services.ScriptService] в класс Service1, чтобы его можно было напрямую вызывать из jQuery в качестве веб-службы json.

Эти статьи помогли мне:

ASMX и JSON - Распространенные ошибки и заблуждения

Использование jQuery для использования веб-служб JSON ASP.NET

3 ошибки, которых следует избегать при использовании jQuery с ASP.NET AJAX

htm файл

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>jQuery to ASMX</title>
    <link rel="Stylesheet" type="text/css"
          href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/themes/cupertino/jquery-ui.css"/>

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>

    <script type="text/javascript"
            src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/jquery-ui.min.js"></script>

    <script type="text/javascript" src="http://localhost/Scripts/json2.min.js"></script>
</head>
<body>

<script type="text/javascript">
    $(document).ready(function() {

        $("#txtInput").autocomplete({
            source:function (request, response) {
                var paramters = {
                    isoalpha2: '<%=Session["BusinessCountry"].ToString()%>',
                    prefixText: request.term
                };
                $.ajax({
                    url: 'Service1.asmx/GetCitiesWithState',
                    type: 'POST',
                    dataType: 'json',
                    contentType: 'application/json; charset=utf-8',
                    data: JSON.stringify(paramters),
                    success: function(data) {
                        response($.each(data.d, function(index, value) {
                            return {
                                label: value,
                                value: index
                            }
                        }));
                    }
                });
            },
            minLength:2,
            delay:500
        });

    });
</script>

<p>
    Hello, World!</p>
<label for="txtInput">
    Enter the string here:</label><input type="text" id="txtInput"/>
</body>
</html>

Файл asmx

using System.Web.Script.Services;
using System.Web.Services;

namespace jQueryAutoCompleteBackEnd
{
    /// <summary>
    /// Summary description for Service1
    /// </summary>
    [WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    [System.ComponentModel.ToolboxItem(false)]
    [ScriptService]
    public class Service1 : WebService
    {

        [WebMethod]
        [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
        public string[] GetCitiesWithState(string isoalpha2, string prefixText)
        {
            return new string[] { "New Orleans, Lousiana", "New York, New York" };
        }

    }
}
0 голосов
/ 14 апреля 2011

Причина, по которой веб-метод asmx возвращает XML, а не JSON, заключается в том, что HTTP-метод GET, а не POST .

Чтобы плагин автозаполнения использовал POST, вы будете использоватьнеобходимо реализовать параметр источника, используя функцию обратного вызова, см. здесь

...