Arquivo da tag: MVC

ASP.NET MVC: Dica de site

Olá pessoal.

Estou passando para deixar os links abaixo. São dicas sobre o ASP.NET MVC que vão direto ao ponto. Vale a pena conferir.

 

Espero que seja útil. Para mim foi!!!

O poder de usar Visões Parciais (partial views) com JQuery

Estou tentando aprender como criar página Web usando o Pattnern MVC 3 que acompanha o VisualStudio 2010. E hoje aprendi algo que me fascinou (pois no ASP.NET tradicional não é tão simples), invocar WebUserControls em chamadas AJAX. Vamos lá.

Uma Partial View é uma espécie de WebUserControl do MVC, ou seja, é possível criar pedaços de código a serem reaproveitados posteriormente em outras páginas.

Com o MVC é possível invocar via chamadas AJAX (neste caso com JQuery) Partial Views, ou seja, de forma simples posso via Ajax trazer o conteúdo da View que está no servidor.

A primeira coisa é criar a referência para biblioteca JQuery numa View normal ou MasterPage. E depois criar a Partial View e seu respectivo Action Controller.

Partial View OutroCurso.ascx:


<table cellpadding="0" cellspacing="0" style="width: 608px">
    <tr>
        <td style="width: 288px">
            Se sim, qual curso?<br />
            <%:Html.TextBox("txtQualCurso", "", new { maxlength = "10", style = "width:264px" })%>
        </td>
        <td>
            Em qual instituição?<br />
            <%:Html.TextBox("txtQualInstituicao", "", new { maxlength = "10", style = "width:264px" })%>
        </td>
    </tr>
</table>

Action Controller da Partial View OutroCurso.ascx:


public ActionResult OutroCurso()
{
    return PartialView();
}

E por fim, falta fazer a chamada AJAX para a Partial View acima dentro de uma View normal ou MasterPage.

A ideia do código abaixo é que o usuário ao selecionar o radiobutton SIM, apareçam outros campos a serem preenchidos (a Partial View). Observe que cada radionbutton em seu evento onclick chama a função JavaScript loadPartialViewOutroCurso, responsável por usar o método Load disponível na biblioteca JQuery para invocar a Partial View no servidor.

Possui outro curso superior?<br />
<%:Html.RadioButton("rblOutroCurso", "N", false, new { onclick = "loadPartialViewOutroCurso('N')" })%> Não
<%:Html.RadioButton("rblOutroCurso", "S", false, new { onclick = "loadPartialViewOutroCurso('S')" })%> Sim
<div id="divOutroCurso"></div>

<script type="text/javascript">

    function loadPartialViewOutroCurso(opcao) {

        if (opcao == 'S')
            $('#divOutroCurso').load('/Solicitacao/OutroCurso');
        else $('#divOutroCurso').html("");
    }

</script>

A URL a “/Solicitacao/OutroCurso” é a rota para o Action (OutroCurso) do Controller (Solicitacao) que mantém a Partial View.

Bom né?

Abraço e até a minha próxima descoberta no mundo MVC.