Ajax com JQuery em asp.net

Nos últimos tempos muitos sites começaram adotar o Ajax em suas páginas não só pelo fato,Do efeito de carregar a página sem dar um POST na página o Ajax e muito mais que isso.

No artigo de hoje vou ensinar como chamar do Code Behind um método utilizando o Ajax e a linguagem JSOM.

Nesse artigo vamos aprender também algumas maneiras e boas praticas e cuidados que precisa ter quando trabalhamos com jQuery.

Vamos criar um novo projeto do tipo web, sem novidades e colocar os plugin JQuery em uma pasta scripts:
http://code.jquery.com/jquery-1.4.2.min.js

http://code.jquery.com/jquery-1.4.1-vsdoc.js

Após isso vá até o código HTML da nossa página, e coloca o seguinte código:

 ID="hlkCarregarText"  runat="server"  Text="Carregar"  CssClass="carregarAjax" />

Depois chame nosso plugin JQuery para nossa página e coloque o seguinte código.

O código ajax do JQuery e muito simples na  linha 1 eu crio um evento click simples mesmo, nos proximos artigo

vou ensinar mais sobre eventos e seletores no jQuery.

- 2 eu chamo o instancia do objeto XMlhttpRequest que cuida dos eventos ajax da página, a biblioteca jquery

e uma simplificação de tudo porque se nos fosse inicializar o ajax na mão precisaria invalidar todos os browser , porqueo objeto ajax não são igual para todos os browser no IE 6 Msxm12.XMLHTTp e nas proximas versão atual é  Microsoft.XMLHTTP então imagina toda

a vez que nos precisar criar um evento ter que já ter ou criar um função para inicializar o objeto ajax do browser.

-3 Type :  linha que tipo de requisição nos vamos fazer GET ou POST no caso vamos sempre utilizar POST.

-4 url: url na qual vai ser requisitada e recebe na frente o nome do nosso metod que vai ser chamado.

-5 data: as chaves são a encapsulação do que vai ser enviado para o servidor no caso o que esta retornando do nosso metodo.

-6 contentType: o tipo de conteudo que esta sendo enviado para o servidor.

-7 dataType: E o tipo de dados esperado pelo servidor como retorno no caso nos estamos utlizando jsom que vai estrarir  no codebehind nosso metodo

-8 sucess:quando nossa requisão é efetuada com sucesso o status da nossa página e 200 assim o ajax sabe
    que pode execultar ou retorna qualquer metodo para á pagina.

Após isso vamo nos codeBehind (cs) e vamo criar um metodo que vai receber no cabeçalho a tag [WeMethod] da namespace 

System.Web.Services, e vamos criar o metodo como mostra abaixo.

[WebMethod]

public static string GetText()

{

return "Parabéns o metodo foi chamando com sucesso";

}

        Após isso execulte o projeto e clique sobre o link, a nossa div#atenção vai trocar o texto pelo o que nosso metodo retorna   sem carregar há página, isso seria alguma das coisas que nos podemos fazer sem usar o updatepanel do asp.net e ainda trabalhar   com o retorno desse metodo em funções jQuery.  

Dicas: sempre quando for criar algum evento usando seletores use como referencia CssClass dos controle do asp.net,   quando nos colocamos o ID do nosso controle na hora que carrega há página o asp.net renderiza nosso controle e muda oID assim nos acaba tendo alguns problemas.