Jquery Autocomplete in dotnet

This is a small tutorial of how to implement jquery autocomplete text box in dot net. You can try in any plat form  using these steps.

First you need to download or add reference to these scripts and css.

<link href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />

<script src="http://code.jquery.com/jquery-1.8.3.js" type="text/javascript"></script>

<script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js" type="text/javascript"></script>

The download links for the above files are

jquery-ui.css

jquery-1.8.3.js

jquery-ui.js 

Actually we are getting the autocomplete text as comma separated string from db,

public string Autocomplete

 {

    get

      {

          return "c++, java, php, coldfusion, javascript, asp, ruby";

      }

  }

I implemented it like a property.

And the jqery part is very simple.

$(document).ready(function () {

                      

    var tags = '<%=Autocomplete %>'; // Property from code behind

    tags = tags.replace("'", ""); // Spliting the string with comma and putting it into array

    var tagArray = tags.split(",");

    $("#<%=txtAutocomplete.ClientID %>").autocomplete({

         source: tagArray

     });

 });

 

 Simple and nice...

  

Download sample Click here