Você possui duas bibliotecas open-source para fazer solicitações AJAX em ASP.NET MVC, Microsoft ASP.NET AJAX e JQuery, você pode facilmente utilizar uma outra que você esteja mais familiarizado ou ainda criar sua própria biblioteca.
Neste exemplo vou utilizar a biblioteca da Microsoft, vamos ao exemplo.
Modelo
O modelo da aplicação será uma classe com apenas quatro propriedades.
public class Cliente
{
public int ClienteId { get; set; }
public string Nome { get; set; }
public string Telefone { get; set; }
public string Endereco { get; set; }
}
View
Para deixar o exemplo mais simples vou utilizar a View Index do Controller Home para criar um formulário referente ao modelo Cliente.Veja abaixo o código da view.
1.Código da View Index
Utilizei o Ajax.BeginForm Helper Methods para montar o formulário que será enviado ao servidor via AJAX para Action Salvar dentro do Controller Home, esse formulário possui todos os inputs referentes às propriedades do modelo Cliente. Por fim adiciono dois arquivos JavaScript MicrosoftAjax.js e MicrosoftMVCAjax.js , referente a biblioteca da Microsoft para trabalhar com AJAX.
Ajax.BeginForm Helper Methods
O ASP.NET MVC disponibiliza o Helper Ajax para facilitar a construção das Views com recursos AJAX, essa é a principal diferença entre as duas bibliotecas disponíveis, o JQuery é uma framework poderosíssima mais ainda não possui nenhum Helper, você pode implementar um se quiser, mais por padrão ainda não tem.
O método Ajax.BeginForm possui muitas sobrecargas, eu utilizei uma que recebe dois parâmetros nome da Action e uma instância da classe AjaxOptions. Na instância da classe AjaxOptions utilizei duas propriedades. UpdateTargetId: define o id do elemento HTML que será utilizado para exibir o retorno do servidor. Confirm: define a mensagem de confirmação que será exibida para o usuário antes do início do processo.
Construindo a Action Salvar
Veja o código da action Salvar que deve ser adicionado no Controller Home.
[AcceptVerbs(HttpVerbs.Post)]
public string Salvar(Cliente cliente)
{
return String.Format("Id : {0}
Nome : {1}
Endereço : {2}
Telefone : {3}",
cliente.ClienteId, cliente.Nome, cliente.Endereco, cliente.Telefone);
}
A action Salvar só pode ser acessada via Post isso foi definido através do atributo AcceptVerbs, ela recebe como parâmetro um objeto Cliente e retorna uma string com todos os dados do objeto, essa string será exibida na elemento HTML definido na propriedade UpdateTargetId.
Importante: note que em nenhum momento crio uma instância da classe Cliente, isso é feito pela própria Framework. O bind das propriedades trabalha da seguinte forma, se tenho um input com o nome ClienteId e uma propriedade com o mesmo nome a Framework tenta preencher a propriedade com o valor do input caso não consiga ela mantém o valor padrão da propriedade.
Agora podemos executar a aplicação, veja na imagem abaixo.
2.Imagem da aplicação.
Ao clicar no botão Create todos os inputs do formulário são submetidos via AJAX ao servidor para a action Salvar que por sua vez retorna uma string com os dados submetidos, esses dados são exibidos na elemento HTML definido na propriedade UpdateTargetId.
Conclusão
Construir aplicações web com recursos AJAX em ASP.NET MVC é tão fácil quanto em Web Forms com a vantagem de ter o controle de tudo. Aqui nesse link você pode baixar a aplicação em C# e VB.NET.
Daniel Fonseca Castro