Chamar Função CSharp com Jquery

Deseja realizar chamadas assincronas, como é feito com páginas do google ou facebook? Utilizando uma biblioteca Jquery você será capaz de requisitar informações, capturar informações em Json e popular sua tela.

por Robson Alves

Uma funcionalidade bem legal do Jquery em conjunto com o C#, estão nas possibilidade de chamadas assincronas, melhor ainda quando podemos acessar código C#.

Primeiramente vamos montar o script Jquery, ele pode estar dentro de um arquivo JS na solution ou na página.

O código está comentado, entretanto estamos utiizando o Ajax do Jquery capturando dados via Post e retornando Json. Veja:

$(document).ready(function () {

$("#").click(function () {
$.ajax({
type: "POST",
url: "Default.aspx/Exemplos", // url da pagina/nome do metodo
contentType: "application/json; charset=utf-8",
dataType: "json",
data: "{}", //parametros da função
success: function (json) {
var JSONObject = json.d;
var html = "";
for (var i = 0; i html = html + JSONObject[i].Valorbool + " - " +
JSONObject[i].Valortxt + "

";
}
$("#Ap").html(html).hide("slow").show("Slow");
},
error: function (XMLHttpRequest, textStatus, error) {
alert(XMLHttpRequest.responseText);
}
});
return false; //Prescindivel para que o ASP.NET __DoPostBack não seja executado
});
});

 Pra não sobrar dúvidas abaixo segue a sintaxe para informar parâmetros caso seu metódo Server-Side os possua.

 data: "{Nome:"Robson"}",  //Apenas um parâmetro

data: "{Nome:"Robson", Sobre: "Alves"}", //dois parâmetros

Atente-se:

Os parâmetros são case-sensitive

Caso tenha acrescido um parâmetro de entrada e gerar exceções, faça um re-build da solution e nos piores casos feche o IIS server do Visual Studio.

A frente fica o nome do parâmetro, seguido do valor.

Os Objetos utilizados neste exemplo:   

Agora temos nossa página pronta para capturar as informações e o alvo onde será renderizada a informação, partimos para o lado do servidor agora.

   [WebMethod]

        public static List Exemplos(string Nome, string Sobre)

        {

            List list = new List();

            Objetos obj = new Objetos();

            for (int i = 0; i < 10; i++)

            {

                obj = new Objetos();

                obj.Valorbool = i % 2 == 0 ? true : false;

                obj.ValorNum = i;

                obj.Valortxt = "RobsonAlves - " + Nome + " <-> " + Sobre;

                list.Add(obj);

            }

            return list;

        }

Veja na primeira linha, o WebMethod é quem permite que este método seja exposto Client-side, possibilitando o acesso pelo Jquery. Este exemplo gera uma lista, nada me impedi de pegar as informações do Banco. Detalhes deste:

Os métodos sempre devem ser públicos

A Assinatura é [WebMethod] no singular, [WebMethods] no Plural não serve.

Note que estamos retornando uma lista de Objetos que é uma classe POCO:

    public class Objetos

    {

        public int ValorNum { get; set; }

        public string Valortxt { get; set; }

        public Boolean Valorbool { get; set; }

    }

Após estes passos, você terá as informações da lista na sua tela.
Espero que este artigo seja útil.
Obrigado.