2012-08-02 111 views
1

这一切看起来不错下面我提供了3个部分的服务工作正常,如果查询。自动完成没有发射

/// <summary> 
/// Summary description for AutoCompleteService 
/// </summary> 
[WebService(Namespace = "http://schemas")] 
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] 
[System.ComponentModel.ToolboxItem(false)] 
[System.Web.Script.Services.ScriptService] 
public class AutoCompleteService : BaseWebService 
{ 
    /// <summary> 
    /// Gets or sets the account finder service. 
    /// </summary> 
    public ICheckoutService CheckOutService { get; set; } 

    /// <summary> 
    /// Finds all addresses matching either the postcode or suburb given in the prefix text. 
    /// </summary> 
    /// <param name="prefixText">The prefix text.</param> 
    /// <param name="count">The count.</param> 
    /// <returns>Aray of address details</returns> 
    [WebMethod] 
    public string[] FindAddresses(string prefixText, int count) 
    { 
     //Check the parameters 
     if (count == 0) count = 10; 
     var suburbs = CheckOutService.FindMatchingForPartialAddress(prefixText); 
     return suburbs.Take(count).ToArray(); 


    } 
} 

其次是JavaScript的

<script language="javascript"> 


$(function() { 
    $("#postcode").autocomplete({ 
     source: "AutoCompleteService.asmx/FindAddresses", 
     minLength: 1, 
     select: function (event, ui) { 
      $(this).val(ui.item.value); 
     } 
    }); 
}); 
</script> 

其次是文本框

 <asp:TextBox runat="server" name="postcode" id="postcode" ></asp:TextBox> 

响应

<ArrayOfStringxmlns: xsi="http://www.w3.org/2001/XMLSchema-instance"xmlns: xsd="http://www.w3.org/2001/XMLSchema"xmlns="http://schemas.forcetechnology.com.au/2009/04/Fulfilment"><string>ABBARIVER,WA,6280</string><string>ABBEY,WA,6280</string><string>ACTONPARK,WA,6280</string>string>ADAMSVALE,WA,6375</string></ArrayOfString> 

好吧,我做了如下改变三江源都指着我在正确的直销并提供了一个出发点,也为此给了我错误消息,这有助于修改如下。

  [ScriptMethod(ResponseFormat = ResponseFormat.Json)] 
    public string[] FindAddresses(string prefixText) 
    { 
     //Check the parameters 

     var suburbs = CheckOutService.FindMatchingForPartialAddress(prefixText); 
     return suburbs.ToArray(); 


    } 


    $(document).ready(function() { 
    $('[ID$=postcode]').live('keyup.autocomplete', function() { 

     $(this).autocomplete({ 
      source: function (request, response) { 
       alert(request.term); 
       $.ajax({ 
        url: '<%=ResolveUrl("AutoCompleteService.asmx/FindAddresses") %>', 
        data: "{ prefixText:'" + request.term + "'}", 
        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) { 
      }, 
      minLength: 1 
     }); 
    }); 
}); 
+0

你得到任何错误? – 2012-08-02 07:40:21

+0

文本框元素的实际ID可能不同,因此jQuery不会找到它。在标记中添加'ClientIDMode =“Static”'。 – 2012-08-02 07:40:30

+0

@ShadowWizard提供的OP使用.net 4. – Flash 2012-08-02 07:43:50

回答

1

试试下面的代码。这是为我工作..

$(document).ready(function() { 
     $('[ID$=txtLastname]').live('keyup.autocomplete', function() { 

      $(this).autocomplete({ 
       source: function (request, response) { 
        $.ajax({ 
         url: '<%=ResolveUrl("~/Resources/WebService.asmx/LastName") %>', 
         data: "{ 'prefix': '" + request.term + "'}", 
         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) { 
       }, 
       minLength: 1 
      }); 
     }); 

Web方法是

[WebMethod] 
[ScriptMethod(ResponseFormat = ResponseFormat.Json)] 
public string[] LastName(string prefix) 
{ 
    List<string> customers = new List<string>(); 
    using (SqlConnection conn = new SqlConnection()) 
    { 
     string connectionstring = CCMMUtility.GetCacheForWholeApplication(); 
     conn.ConnectionString = connectionstring; 
     using (SqlCommand cmd = new SqlCommand()) 
     { 
      cmd.CommandText = "select distinct top(10) Lastname from tblusers where " + 
      "Lastname like '%'+ @SearchText + '%' order by Lastname"; 
      cmd.Parameters.AddWithValue("@SearchText", prefix); 
      cmd.Connection = conn; 
      conn.Open(); 
      using (SqlDataReader sdr = cmd.ExecuteReader()) 
      { 
       while (sdr.Read()) 
       { 
        customers.Add(string.Format("{0}", sdr["Lastname"])); 
       } 
      } 
      conn.Close(); 
     } 
     return customers.ToArray(); 
    } 
} 
2

如果自动完成是jQueryUI的,你希望提供一些自定义的参数来自动完成,那么你将需要提供一个函数来设置源。 Have a look here 这应该可以帮助你定义它。

此外,作为@暗影WIZZARD说你可能想确保你有正确的id

+0

对不起,我忘了补充说那个自动完成的默认参数是“t”,这就是为什么你需要提供一个函数作为t源。 – Qpirate 2012-08-02 11:48:30