Asp.net + ajax + sqlserver auto-completion

 

Reference (to whom I would like to pay tribute ):

2 http://www.loveweb8.com/plus/demo.php? Aid = 57 This example is the html source code. The jquery. autocomplete plug-in is used to implement the automatic complementing function using js. My need is to use SQL Server database tables to implement automatic completion. The next step is to convert the database table into a js array, and naturally I think of ajax.

2. Two basic development modes of Asp. NetAjax the second part in this article is the example of js webservice call.

 

Code parsing.

1. Add a webservice file.

Add a new project -- "AJAX-enabled WCF Service" and name the new file DBService. svc.

 

2. Add a function to DBService. svc. The returned value of the function is the data that is automatically supplemented.

 

[OperationContract]public string getSortList(){    List
 
   sorts = new List
  
   ();    using (SqlConnection cn = new SqlConnection(ConfigurationManager.ConnectionStrings[zhui.pc].ConnectionString))    {        cn.Open();        SqlCommand cmd = new SqlCommand(select [LastName] from [dbo].[Employees], cn);        DataTable dt = new DataTable();        using (SqlDataAdapter da = new SqlDataAdapter(cmd))        {            da.Fill(dt);        }        foreach (DataRow row in dt.Rows)        {            sorts.Add(row[0].ToString());        }        cn.Close();    }    return string.Join(,, sorts.ToArray());}
  
 

 

 

3. Add js and css files to the default. aspx file:

 

<script src=Scripts/jquery-1.7.1.min.js type=text/javascript></script><script src=Scripts/jquery.autocomplete.min.js type=text/javascript></script>

 

4. In the head section of default. aspx, call webservice in the $ (). ready (function () function to obtain auto-completion data and associate the data to the input box.

 

<Script type = text/javascript> $ (). ready (function () {NewsSort. getSortList (OnComplete, OnFailed, null); function OnComplete (args, context) {$ ('# maincontent_searchbox '). autoComplete ({'data': args. split (,), 'itemheight': 20, 'listdirect': 'low', 'width': 280 }). autoComplete ('show');} function OnFailed (args) {alert (error !); }}); </Script>

 

5. Finish. After the project is published, if the prompt webservice cannot find the object, refer to the http://www.cnblogs.com/aspnethot/articles/2421678.html