Imprimir Post

Caminho Rápido – Utilizando o elemento Raw para exibir código Html interpretado no navegador em uma Aplicação do tipo ASP.NET MVC

Resumo:

O objetivo desta publicação é ensinar como utilizar o elemento Raw para exibir código Html interpretado no navegador em uma Aplicação do tipo ASP.NET MVC à partir da ferramenta de desenvolvimento Microsoft Visual Studio.

O guia será apresentado de maneira a minimizar a parte teórica ao essencial e elevar a parte prática até a concretização do objetivo.

Palavras-chaves:

Visual, Studio, Utilizar, Elemento, Raw, MVC.

Texto:

Adendo

Para realização das tarefas referentes ao objetivo do post, foram utilizados os seguintes Programas:

  • Windows 10 Pro;
  • Microsoft Visual Studio Community 2015 Ultimate (Update 3).

A única configuração realizada após a instalação dos programas acima, foi manter o Microsoft Visual Studio sendo executado como usuário Administrador do Sistema Operacional, a fim de evitar maiores problemas.

Mãos à Obra

A sequência será apresentada de maneira a entender que o leitor já possua a estrutura do projeto tipo ASP.NET MVC da postagem: “Caminho Rápido – Determinando uma Aplicação de apoio do tipo ASP.NET MVC“.

Relembre - Aplicação de apoio ASP.NET MVC

Aplicação de apoio ASP.NET MVC:

Utilizando o elemento Raw para exibir código Html interpretado no navegador - Microsoft Visual Studio Community 2015 – Aplicação de Apoio

Microsoft Visual Studio Community 2015 – Aplicação de Apoio

Adicionando o Controller ClienteController

À partir do projeto anteriormente criado, adicionar um Controller nomeado como ClienteController:

Controller em uma Aplicação ASP.NET MVC - Relembre - Controller

Tela ao adicionar o Controller ClienteController:

Utilizando o elemento Raw para exibir código Html interpretado no navegador - Microsoft Visual Studio Community 2015 - Tela após adicionar o Controller

Microsoft Visual Studio Community 2015 – Tela após adicionar o Controller

Adicionando a View Index

À partir do Controller anteriormente criado (ClienteController), adicionar uma View nomeada como Index:

View em uma Aplicação ASP.NET MVC - Relembre - View

Tela ao adicionar a View Index:

Utilizando o elemento Raw para exibir código Html interpretado no navegador - Microsoft Visual Studio Community 2015 - Tela após adicionar a View

Microsoft Visual Studio Community 2015 – Tela após adicionar a View

Alterando a View Index Cliente

Localizar a pasta Cliente. Na área à direita nomeada como: Solution Explorer, deve-se clicar duas vezes (2x) sobre Index.cshtml, alterando este arquivo para o seguinte código:

Tela ao colar o código:

Utilizando o elemento Raw para exibir código Html interpretado no navegador - Microsoft Visual Studio Community 2015 – Tela após Alteração do Arquivo

Microsoft Visual Studio Community 2015 – Tela após Alteração do Arquivo

Por fim, deve-se salvar a View Index e suas alterações clicando no botão Salvar. Tela com a confirmação positiva (ver rodapé da janela) ao clicar no botão Salvar:

Utilizando o elemento Raw para exibir código Html interpretado no navegador - Microsoft Visual Studio Community 2015 – Tela após Salvar o Projeto

Microsoft Visual Studio Community 2015 – Tela após Salvar o Projeto

Alterando a View Index Default

Localizar a pasta Default. Na área à direita nomeada como: Solution Explorer, deve-se clicar duas vezes (2x) sobre Index.cshtml, alterando este arquivo para o seguinte código:

Tela ao colar o código:

Utilizando o elemento Raw para exibir código Html interpretado no navegador - Microsoft Visual Studio Community 2015 – Tela após Alteração do Arquivo

Microsoft Visual Studio Community 2015 – Tela após Alteração do Arquivo

Por fim, deve-se salvar o arquivo Index e suas alterações clicando no botão Salvar. Tela com a confirmação positiva (ver rodapé da janela) ao clicar no botão Salvar:

Utilizando o elemento Raw para exibir código Html interpretado no navegador - Microsoft Visual Studio Community 2015 – Tela após Salvar o Projeto

Microsoft Visual Studio Community 2015 – Tela após Salvar o Projeto

Finalizando o exemplo, resta apenas executar a Aplicação, deve-se então clicar no botão Start Debugging (F5):

Utilizando o elemento Raw para exibir código Html interpretado no navegador - Microsoft Visual Studio Community 2015 – Execução da Aplicação

Microsoft Visual Studio Community 2015 – Execução da Aplicação

Tela ao clicar no botão Start Debugging (F5):

Utilizando o elemento Raw para exibir código Html interpretado no navegador - Microsoft Visual Studio Community 2015 - Página Principal (Default)

Microsoft Visual Studio Community 2015 – Execução da Aplicação (Janela do Browser) – Página Principal (Default)

Tela ao clicar no Link Ir para página Cliente:

Utilizando o elemento Raw para exibir código Html interpretado no navegador - Microsoft Visual Studio Community 2015 – Execução da Aplicação (Janela do Browser) - Página Cliente

Microsoft Visual Studio Community 2015 – Execução da Aplicação (Janela do Browser) – Página Cliente

Considerações Finais:

Esta publicação visa utilizar o elemento Raw para exibir código Html interpretado no navegador em uma Aplicação do tipo ASP.NET MVC.

Vale destacar que:

  • Raw é um elemento que tem a função de converter código texto em código Html interpretado.
  • No exemplo, houve a modificação de elementos de texto no Design particular tanto da View Index pertencente a Default, quanto na View Index de Cliente.

Design particular em uma Aplicação ASP.NET MVC - Relembre - Design particular

  • Além disso, Raw é transcrito em código como @Html.Raw(string) na View Index de Cliente definindo o código “<div style=’margin: 20px 0 20px 0; text-decoration:underline; font-size:12pt;’><b>LinkSinergia</b></div>” para conversão de código texto em código Html.
  • O elemento ActionLink também está presente como recurso no exemplo, porém apenas como redirecionamento entre as páginas.

ActionLink em uma Aplicação ASP.NET MVC - Relembre - ActionLink

Referências Bibliográficas:

As referências bibliográficas não se aplicam a este post.

Sobre o autor

Thiago Richard Vanicore

Thiago Richard Vanicore formou-se em análise e desenvolvimento de sistemas, possui certificação ITIL Foundation V2 e entre seus conhecimentos estão: ASP .Net (WebForms/MVC5/Web API) C#, HTML5, Html/XHtml, CSS3, JQuery, JQuey Mobile, JavaScript, Xml, Ajax, Json, Microsoft SqlServer, MySql, Firebird, Azure, Visual Studio Online, Scrum, UML, CRM, Quality Assurance, CTI (Computer Telephony Integration) MPSBR (Melhoria de Processos do Software Brasileiro).

Link permanente para este artigo: http://linksinergia.com.br/2017/07/26/caminho-rapido-utilizando-o-elemento-raw-para-converter-atributos-em-caracteres-de-codificacao-html-em-uma-aplicacao-do-tipo-asp-net-mvc/

Deixe uma resposta