Tuesday, November 20, 2012

Jquery UI autocomplete text box in Asp.net

In previous articles we have seen how to develop a Ajax autocomplete text box,Validate Asp.net dropdownlist using Jquery,Get dropdownlist selected value in Jquery,Allow only Numbers to textbox.Here i will show how to create a text box with auto complete using JqueryUI.Whenever use the jquery ,we need to add the jquery reference libraries to our application.In below i have been used jquery libraries(JqueryUI)and css to this task. In jquery i just create a array withe elements,then it will be assign to text box using auto complete .
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>
<script type="text/javascript">
$(function () {
var Keyword_Data = ["Share point","Sharepoint2010","Asp.Net","Asp","Csharp","Dotnet","MVC","MVC4","Jquery","Vb",
"Vb.Net","Sql Server","SQLSERVER 2012","Sliver Light"];
$("#<%= autoc1.ClientID %>").autocomplete({
source: Keyword_Data
});
});
</script>
Aspx:
Autocomplete textbox using jquery
<div>
<form id="UIform2" runat="server">
<asp:label id="tex" runat="server" text="Technology:"></asp:label>
<asp:textbox id="autoc1" runat="server"></asp:textbox>
</form>
</div>

No comments:

Bel