JQuery AutoComplete (jQuery UI 1.8rc3) avec le service Web ASP.NET

Question

Actuellement, cette version du contrôle de saisie semi-automatique fonctionne lorsque vous renvoyez du code XML à partir d'un gestionnaire .ashx. Le xml ressemble à ceci:

<?xml version="1.0" encoding="UTF-8" standalone="no" ?> 
<States> 
<State> 
    <Code>CA</Code> 
    <Name>California</Name> 
</State> 
<State> 
    <Code>NC</Code> 
    <Name>North Carolina</Name> 
</State> 
<State> 
    <Code>SC</Code> 
    <Name>South Carolina</Name> 
</State> 

Le code autocomplete ressemble à ceci:

$('.autocompleteTest').autocomplete(
    { 
     source: function(request, response) { 
      var list = []; 
      $.ajax({ 
       url: "http://commonservices.qa.kirkland.com/StateLookup.ashx", 
       dataType: "xml", 
       async: false, 
       data: request, 
       success: function(xmlResponse) { 
        list = $("State", xmlResponse).map(function() { 
         return { 
          value: $("Code", this).text(), 
          label: $("Name", this).text() 
         }; 
        }).get(); 
       } 
      }); 
      response(list); 
     }, 
     focus: function(event, ui) { 
      $('.autocompleteTest').val(ui.item.label); 
      return false; 
     }, 
     select: function(event, ui) { 
      $('.autocompleteTest').val(ui.item.label); 
      $('.autocompleteValue').val(ui.item.value); 
      return false; 
     } 

    }); 

Pour diverses raisons, je préfère être l'appel d'un service Web ASP.NET, mais je Je n'arrive pas à le faire fonctionner. Pour passer au service (je fais un service local pour faire simple), le début du code de saisie semi-automatique est:

$('.autocompleteTest').autocomplete(
    { 
     source: function(request, response) { 
      var list = []; 
      $.ajax({ 
       url: "/Services/GeneralLookup.asmx/StateList", 
       dataType: "xml", 

Ce code se trouve sur une page à la racine du site et la GeneralLookup .asmx se trouve dans un sous-dossier nommé Services. Mais un point d'arrêt dans le service Web n'est jamais atteint, et aucune liste de saisie semi-automatique n'est générée. Dans le cas où cela fait une différence, le XML qui vient de la asmx est:

<?xml version="1.0" encoding="utf-8" ?> 
<string xmlns="http://www.kirkland.com/"><State> <Code>CA</Code> <Name>California</Name> </State> <State> <Code>NC</Code> <Name>North Carolina</Name> </State> <State> <Code>SC</Code> <Name>South Carolina</Name> </State></string> 

Fonctionnellement équivalent depuis que je ne l'utilise jamais le nom du nœud racine dans le code de mappage. Je n'ai rien vu dans les docs jQuery sur l'appel d'un service .asmx à partir de ce contrôle, mais un appel .ajax est un appel .ajax, n'est-ce pas?

J'ai essayé différents chemins pour le .asmx (~/Services /), et j'ai même déplacé le service pour être dans le même chemin pour éliminer ces problèmes. Pas de chance avec l'un ou l'autre.

Des idées?

Answer 1

J'ai obtenu la saisie semi-automatique pour travailler avec .asmx en utilisant JSON. Voici un exemple de ce que je faisais:

JavaScript:

$("#tbNameFilter").autocomplete({ 
    source: function (request, response) { 
     $.ajax({ 
      url: "/Services/AutocompleteService.asmx/Aoi_Autocomplete", 
      data: "{ 'q': '" + request.term + "', 'limit': '10' }", 
      dataType: "json", 
      type: "POST", 
      contentType: "application/json; charset=utf-8", 
      dataFilter: function (data) { return data; }, 
      success: function (data) { 
       response($.map(data.d, function (item) { 
        return { 
         label: item.Name, 
         value: item.Name 
        } 
       })) 
      } 
     }); 
    }, 
    minLength: 1 
}); 

Service Web:

[WebMethod] 
public List<FAD_Aoi> Aoi_Autocomplete(String q, int limit)