Desenvolvimento - Javascript

JQuery auto complete em Asp.Net

Nesse artigo será mostrado como é possivel trabalhar com plugin auto complete do jQuery em asp.net usando banco de dados SQLServer.

por Emerson Jose



Bem vindo a mais um artigo sobre JQuery nesse poste vou aborda o plugin auto complete, que é super bacana e muito útil para nos não ficar cadastrando nada repetindo no banco ajudar preencher campos facilitar em busca etc.

A imagem abaixo mostra um Preview do que nos vamos criar.

imagem1

Vamos começar Criando um novo projeto do tipo ASP.NET Web Application, após criar vamos criar uma pasta com nome Script aonde nos vamos colocar todos os nossos plugins necessários para funcionar o nosso projeto auto complete, no final do artigo vou colocar um link para Download do código fonte com todo os plugins.

Após adicionar os plugins na pasta script vamos abrir a página Default.aspx é importa nossos plugins, depois que importa todos os plugins vamos começar a codificar nosso código jQuery que é bem simples a imagem abaixo mostra como seu código deve ficar.

imagem2

O código e bem simples, nos coloca o Id do nosso textobox no evento autocomplete do jQuery e depois nos chamamos nossa página AutocompleteData.ashx que e do tipo Generic Handler , que recebe o que foi digitado no textobox é passa por QueryString a primeira letra que nos digitamos aonde dentro da página handler nos recupera por HTTP.Context.QueryString esse parâmetro que foi passado pelo plugin e utilizamos no Select.

Vamos agora criar uma pagina do tipo Generic Handler como o nome AutocompleteData.

imagem3

Após criar vamos adicionar o código abaixo como mostra a imagem.

 

Não se esqueça de alterar a string de conexão, no caso estou utilizando o banco Northwind você pode usar qualquer um que deseja pegar os dados para utilizar nos seus campos para auto completar os texto, espero que goste até a próxima.

Download Código Fonte.

Fonte do artigo: http://www.eggheadcafe.com/tutorials/aspnet/18b6a1fa-a7cf-4507-84f2-15056fe65bb7/autocompletion-with-jque.aspx

Emerson Jose

Emerson Jose - Analista Programador Jr. em ASP.NET na linguagem c#, trabalha na linguagem a um ano e meio desenvolvendo artigos para seu blog http://programmingcsharp.wordpress.com e trabalha em uma consultoria na região de São Paulo.