4
Answers

How to make jquery autocomplete works from usercontrol using

Photo of Dharam Rai

Dharam Rai
5y
905
1
I have jQuery to pull the autocomplete record as I type in the textbox, this data is being fetched using webservice. Now, everything works fine while using in Default.aspx page, but when I use this process from UserControl.ascx and call it in the default.aspx page then it doesn't return the autocomplete data (result).
 
WebService.asmx code:
  1. [WebMethod]  
  2. public List<string> GetAutoCompleteData(string username)    
  3. {    
  4. string conString = ConfigurationManager.ConnectionStrings["MYCONNECTION"].ConnectionString;    
  5. List<string> result = new List<string>();    
  6. using (SqlConnection con = new SqlConnection(conString))    
  7. {    
  8. using (SqlCommand cmd = new SqlCommand("select DISTINCT SSName from SSRecord where SSName LIKE '%'+@SearchText+'%'", con))    
  9. {    
  10. con.Open();    
  11. cmd.Parameters.AddWithValue("@SearchText", username);    
  12. SqlDataReader dr = cmd.ExecuteReader();    
  13. while (dr.Read())    
  14. {    
  15. result.Add(dr["SSName "].ToString());    
  16. }    
  17. return result;    
  18. }    
  19. }    
  20. }
UserControl.ascx code:
  1. <script src="jquery-1.11.2.js" type="text/javascript"></script>  
  2. <link href="jquery-ui.css" rel="stylesheet" />  
  3. <script src="jquery-ui.js" type="text/javascript"></script>  
  4. <script type="text/javascript">  
  5. $(document).ready(function () {  
  6. SearchText();  
  7. });  
  8. function SearchText() {  
  9. $(".autosuggest").autocomplete({  
  10. source: function (request, response) {  
  11. $.ajax({  
  12. type: "POST",  
  13. contentType: "application/json; charset=utf-8",  
  14. url: "WebService.asmx/GetAutoCompleteData",  
  15. data: "{'username':'" + document.getElementById('txtSearch').value + "'}",  
  16. dataType: "json",  
  17. success: function (data) {  
  18. response(data.d);  
  19. },  
  20. error: function (result) {  
  21. alert("Error");  
  22. }  
  23. });  
  24. }  
  25. });  
  26. }  
  27. </script>  
  28. <label for="tbAuto">Enter UserName: </label>  
  29. <asp:TextBox ID="txtSearch" runat="server" class="autosuggest"></asp:TextBox>  
  30. Default.aspx code:  
  31. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>  
  32. <%@ Register Src="~/UserControl.ascx" TagPrefix="uc1" TagName="UserControl" %>  
  33. <body>  
  34. <form id="form1" runat="server">  
  35. <div>  
  36. <uc1: UserControl runat="server" ID="UserControl"/>  
  37. </div>  
  38. </form>  
  39. </body>  

Answers (4)

Next Recommended Forum