2010-03-18 13 views
5

Actualmente, tengo esta versión del control de autocompletar funcionando al devolver XML desde un controlador .ashx. El XML es el siguiente:jQuery AutoComplete (jQuery UI 1.8rc3) con servicio web ASP.NET

<?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> 

el código de autocompletar se ve así:

$('.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; 
     } 

    }); 

Por diversas razones, prefiero estar llamando a un servicio web ASP.NET, pero no puede hacer que funcione Para volver a utilizar el servicio (que estoy haciendo un servicio local que sea sencillo), el inicio del código de autocompletar es:

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

Este código está en una página en la raíz del sitio y la GeneralLookup .asmx está en una subcarpeta llamada Servicios. Pero un punto de interrupción en el servicio web nunca se golpea, y no se genera una lista de autocompletar. En caso de que se hace una diferencia, el XML que viene de la asmx es:

<?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> 

funcionalmente equivalentes ya que nunca uso el nombre del nodo raíz en el código de mapeo. No he visto nada en los documentos jQuery sobre llamar a un servicio .asmx desde este control, pero una llamada .ajax es una llamada .ajax, ¿verdad?

He intentado varias rutas diferentes a .asmx (~/Services /), e incluso he movido el servicio para que esté en la misma ruta para eliminar estos problemas. Sin suerte con ninguno.

¿Alguna idea?

Respuesta

17

Obtuve el autocompletado para trabajar con .asmx usando JSON. Aquí está un ejemplo de lo que hice:

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 
}); 

servicio Web:

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

Esto es perfecto. Resolvió mi problema exactamente. – akabak

+0

¡Muchas gracias! @Doc Hoffiday –

+0

Gracias !!! Resolvió mi problema – StarCub

Cuestiones relacionadas