Desenvolvimento Web Com ASP.net - Dicas Gerais

Desenvolvimento de Aplicações para InternetProf. Ednilson Dicas ● Eventos - Para que um componente dispare eventos, a propriedade AutoPostBack deve estar setada como True. Caso contrário, ele permitirá a programação do evento, mas este não será disparado durante a execução da página. ● Validadores - Os botões (Buttons, ImageButtons, LinkButtons, ...) por padrão, quando executados, disparam todos os validadores da página. Porém existem casos onde os botões devem ser executados independetemente se a janela está corretamente preenchida ou não, como por exemplo um botão "Voltar". Para isso devemos desabilitar a propriedade CausesValidation dos botões. Controles A maioria dos controles do ASP.Net, são muito semelhantes ao existente no Windows Forms, como é o caso do Label, TextBox, CheckBox, RadioButton entre outros. Serão exibidos a seguir alguns componentes importantes do ASP.Net que existem apenas no ASP.Net ou que sofreram alguma alteração em relação ao Windows. Botões O ASP.Net disponibiliza alguns tipos de botões: ● Button: Botão tradicional. ● ImageButton: Controle Image com características de um botão (dispara o evento Click) quando o usuário clica sobre a imagem. ● LinkButton: HyperLink com funcionalidades de um botão. Todo botão, ao ser clicado, automaticamente faz um PostBack, mesmo que ele não tenha nenhum evento programado. HyperLink Cria um link de redirecionamento para outra página. Principais propriedades: ● Text com o texto que será exibido no link ● NavigateUrl que indica a url para onde o link irá apontar, ● Opcionalmente podemos alterar a propriedade ImageUrl que faz com que o link seja feito a partir de uma imagem. Atenção: ou usamos a propriedade NavigateUrl ou ImageUrl. Caso as duas sejam definidas somente a ImageURL irá funcionar. DropDownList Componente equivalente ao ComboBox do Windows Forms. Para popular um DropDownList, devemos inicialmente setar as propriedades DataTextField, DataValueField e DataSource e em seguida, chamar o método DataBind. ● DataTextField - armazena o nome do campo que será exibido no DropDown, normalmente uma descrição. ● DataValueFied - armazena o valor que será identificará o item do DropDown, normalmente a chave primária de uma tabela. ● DataSource - fonte de dados. Pode ser um DataSource, datatable, e até mesmo uma coleção de objetos. ● DataBind - método que efetiva o carregamento do DropDown. O exemplo a seguir mostra o preenchimento de um DropDownList chamado ddlGrupo, onde será exibido uma coluna descritiva da tabela chamada grupo e o dado a ser gravado será o cdgrupo. Ainda neste exemplo, após o carregamento do DropDownList, é inserido um novo item a este componente. Isso porque, ao inserirmos dados de uma tabela, ele automáticamente seleciona o primeiro registro. Para facilitar a usabilidade do usuário e forçar que ele escolha um item, ao invés do sistema algum selecionado, devemos criar um objeto ListItem, onde definimos o Texto e o Valor que ele irá conter e após isso, inserirmos ele no DropDownList. Sub CarregarGrupos() Dim objProd As New Produto Dim novoItem As New ListItem Try 'Preenche o DropDownList com os dados da tabela ddlGrupo.DataTextField = "grupo" ddlGrupo.DataValueField = "cdgrupo" ddlGrupo.DataSource = objProd.ListarTodosGrupos ddlGrupo.DataBind() 'Cria e insere um novo item ao DropDownList na posio 0(zero) novoItem.Text = "Selecione" novoItem.Value = 0 ddlGrupo.Items.Insert(0, novoItem) 'Deixa o novo item selecionado ddlGrupo.SelectedValue = 0 Catch ex As Exception lblErro.Text = "Erro ao carregar grupos" Finally objProd = Nothing End Try End Sub GridView Assim como o componente DropDownList, para carregar um GridView usamos a propriedade DataSource e o método DataBind, sendo que: ● DataSource - fonte de dados. Pode ser um DataSource, DataTable, e até mesmo uma coleção de objetos. ● DataBind - método que efetiva o carregamento do GridView. O GridView é um componente bastante versátil, que permite entre outras coisas incluir outros componentes em suas colunas. A forma mais fácil de editar as colunas de um GridView é selecioná-lo (clicando sobre ele) quando então aparecerá uma pequena seta no canto superior direito. Clicando sobre a seta será aberto um menu lateral como mostra a figura abaixo: Através deste menu, podemos editar as colunas de nosso grid, adicionar novas colunas e editar as colunas templates. Colunas Templates são aquelas que contém outros componentes dentro delas. Colunas templates nos permitem obter seus dados com facilidade em tempo de execução (via programação). Numa coluna template, podemos inserir componentes como TextBox, Label, CheckBox, DropDownList entre outros, e via programação, setar ou obter valores delas. Ela também nos permite, via assistente, definir o carregamento automático desses componentes com informações provenientes da coluna de um DataTable. Os dois principais eventos de um GridView são: RowDataBound e RowCommand, sendo que o primeiro é disparado durante o carregamento do Grid e o segundo durante a iteração entre um usuário e uma coluna template. Por exemplo, se um grid tem um botão em uma de suas colunas, o evento RowCommand é disparado quando um usuário clicar sobre este botão. Validadores de campos O Asp.Net fornece uma série de controles para validação de campos que são realizadas do lado do cliente. As principais propriedades dos validadores são: ● ControlToValidade: controle que será validado; ● Display: Forma de exibição pode ser: ○ Static - deixa reservado o espaço da mensagem de erro mesmo. ○ Dynamic - não aloca o espaço da mensagem de erro e reorganiza a tela caso um erro ocorra e a mensagem seja disparada ○ None - Não exibe a mensagem de erro. Só devemos usar esta opção quando temos na tela um ValidationSummary, caso contrário a mensagem de erro não será exibida. ● ErrorMessage: Mensagem de erro que será exibida quando o validador é disparado. ● Os validadores disponíveis são: ● RequiredFieldValidator: Valida se um campo da tela está preenchido. ● RangeValidator: Valida intervalos de valores ● RegularExpressionValidator: Permite validar expressões, como por exemplo formato de Url ou E-mail. Isso é feito através da propriedade ValidationExpression. ● CompareValidator: Compara valores (exemplo: valor do campo >= 10) através das propriedades Operator e ValueToCompare ou valida tipos de dados, setando a propriedade Operator=DataTypeCheck e selecionando o tipo de dado na propriedade Type. ● ValidationSummary: Lista um resumo de erros numa página. Duas importantes propriedades são ShowMessageBox e ShowSummary sendo que a primeira exibe ou não os erros na forma de MessageBox e a segunda exibe ou não uma lista de erros na página. Um tutorial interessante que trata sobre o assunto pode ser encontrado em: http://www.macoratti.net/aspnctl2.htm . Redirecinamento Podemos realizar o redirecinamento para outra página através de um Link na página, que pode ser feito através de comando HTML ou controle ASP.Net, e via codificação, ou seja, durante a programação de um evento, podemos redirecionar a execução de uma página. A seguir serão exibidos os métodos mais comuns: Html Comando:<a href="Pagina1.aspx" title="Teste de ToolTip">Redirecionar p/ Página 1</a> onde: ● O texto que estiver entre as tags <a> e </a>, aparecerá na página como um link. ● href deve receber a url para onde a página será redirecionada quando clicada e ● title indica o ToolTip que será mostrado quando o mouse for pousado sobre o link. Para inserir uma imagem em uma página HTML usamos a tag <img>. É possível fazer um link em uma imagem. Para isso primeiro inserimos a tag de link <a> e dentro dela colocamos a tag <img> de imagem como mostra o exemplo a seguir: <a href="Pagina1.aspx" title="Teste de ToolTip"><img src="Imagens/NavForward.png" alt="Redirecionar p/ a página 1"></img></a> Sendo que, para a imagem: ● src armazena o endereço da imagem que será exibida ● alt é o texto que será exibido no caso de falhá no carregamento da imagem ● Opcionalmente podemos colocar a propriedade border="0" para que a borda da imagem não seja exibida. ASP.Net Podemos usar alguns controles para realizar redirecionamentos entre páginas. Dentre eles podemos citar os componentes HyperLink, Button, ImageButton, LinkButton. Para o HyperLink, podemos alterar a propriedade NavigateUrl para definir o caminho da página que desejamos redirecionar. Já nos botões, podemos alterar a propriedade PostBackUrl para o caminho desejado, de forma que quando clicado, o botão redireciona para a página desejada sem a necessidade de codificação alguma. Durante a programação, se houver necessidade, também podemos realizar um redirecionamento através do comando Response.Redirect("PaginaRedirecionada.aspx"), onde no lugar de "PaginaRedirecionada.aspx" podemos colocar qualquer url. Visão Geral sobre o Gerenciamento de Estado do ASP.NET Uma nova instância da classe da página Web é criada sempre que a página for lançada para o servidor. Em programação Web tradicional, isso normalmente significa que todas as informações associadas com a página e os controles na página seriam perdidos a cada processamento. Por exemplo, se um usuário inserir informações em um caixa de texto, essas informações poderiam ser perdidas no processamento do navegador. Para superar essa limitação inerente da programação tradicional da Web, o ASP.NET inclui várias opções que ajudam a preservar dados em uma base por página e todo o aplicativo continuamente. Esses recursos são: ● ViewState (Estado de Exibição) ● ControlState (Estado de controle) ● Hidden Fields (Campos ocultos) ● Cookies ● Query Strings(String de consulta da url) ● Application State (Estado do Aplicativo) ● Session State (Estado da sessão) ● Profile Properties (Propriedades de Perfil) Cada uma das opções acima tem diferentes características e podem oferecer vantagens e desvantagens, dependendo do cenário em que serão utilizadas. A seguir, cada uma dessas opções será apresentada de forma mais detalhada, e estarão agrupadas de acordo com o local de armazenamento das informações, ou seja, no Cliente ou no Servidor. Opções de Gerenciamento de Estado Baseado no Cliente Nesses casos, as informações do gerenciamento de estado são armazenadas na própria página ou no computador cliente. Nenhuma informação é mantida no servidor. Pertencem a este grupo: View State, Control State, Hidden Fields, Cookies, e Query Strings. ViewState O ViewState é um objeto para armazenamento de valores entre os postbacks que uma página pode sofrer. Esse é o método padrão que as páginas Asp.Net usam para manter os valores das propriedades de controles entre os postbacks. Quando a página é processada, o estado atual da página e controles é armazenado em uma string e salvo na página como um campo oculto. A cada Post Back a página analisa o ViewState na inicialização da página e restaura informações de propriedades de controles na página. É possível armazenar suas próprias informações no ViewState de uma página. Porém, por estar do lado do cliente, e junto à página, não se deve armazenar informações sigilosas neste campo. O ViewState de um controle da página pode ser desabilitado através da propriedade EnableViewState. Quanto maior o ViewState de uma página, maior será seu tempo de carregamento. Para gravar valores em um ViewState, basta utilizar a sintaxe: ViewState.Add(“nome”, “João”) ou simplesmente ViewState(“nome”) = “João”. Onde “nome” é a chave que será usada para armazenar, ou seja, “aonde” será armazenado a informação e o nome “João” é “o que” será armazenado. ControlState Recurso incorporado a partir do Asp.Net 2.0, a propriedade ControlState permite persistir informações da propriedade que são específicas para um controle e não podem ser desativadas, como a propriedade ViewState. Hidden Fields (campos ocultos) O ASP.NET permite que você armazene informações em um controle HiddenField, que funciona como um campo oculto padrão HTML. Um campo oculto não fica visível no navegador, mas você pode definir suas propriedades assim como faria com um controle padrão. Quando uma página é enviada para o servidor, o conteúdo de uma campo oculto é enviado na coleção de formulário HTTP junto com os valores de outros controles. Um campo oculto atua como um repositório de quaisquer informações específicas da página que você deseja armazenar diretamente na página. Um controle HiddenField armazena uma única variável em sua propriedade Value e deve ser explicitamente adicionado à página. Atenção: Pela facilidade em se ver e modificar o conteúdo de um campo oculto, não armazene informações sigilosas nele. Também não guarde nele informações que seu aplicativo se baseie para funcionar corretamente. Cookies Um cookie é uma pequena quantidade de dados (texto) que fica armazenado no cliente. Os cookies podem ser temporários (com datas e horários específicos de expiração) ou persistentes. Você pode usar cookies para armazenar informações sobre um determinado cliente, sessão ou aplicativo. Os cookies são salvos na máquina do cliente, e quando o navegador solicita uma página, o cliente envia as informações no cookie junto com as informações de solicitação. O servidor pode ler o cookie e extrair o valor. O navegador pode enviar os dados de volta somente para o servidor que criou o cookie. Entretanto, os usuários mal-intencionados podem acessar cookies e ler seu conteúdo. É recomendável que você não armazene informações sigilosas, como um nome de usuário ou a senha, em um cookie. Em vez disso, armazene um token no cookie que identifica o usuário, e em seguida, use o símbolo para consultar as informações sigilosas no servidor. A forma mais simples de se criar/atualizar um cookie é: Response.Cookies("usuario").Value = "teste" 'Cria um cookie usuário e joga o valor "teste" nele Response.Cookies("usuario").Expires = Date.Now.AddDays(1) 'Opcional: Indica a data de expiração de um cookie. No exemplo, o cookie deverá ser expirado 1 dia após a data de criação Já para se ler o conteúdo de um cookie: If Request.Cookies("usuario") IsNot Nothing Then Dim usu As String usu = Request.Cookies("usuario").Value End If QueryString Uma QueryString é uma informação acrescentada ao final da URL da página. Uma QueryString de consulta típica pode parecer com o exemplo a seguir: http://www.intranet.anchieta.br/webmagistral/Intranet/biblioteca/bib_resposta.asp?cod_obra=36894&no meCidade=JUNDIAI No caminho da URL acima, a QueryString começa com um ponto de interrogação (?) e inclui dois pares atributo/valor, uma chamada "cod_obra” e o outra chamado "nomeCidade". QueryString fornecem uma maneira simples, mas limitada de manter informações do estado. Elas são uma maneira fácil para passar informações de uma página para outra, como passar um número de produto de uma página para outra página onde ele será processado. No entanto, alguns navegadores e dispositivos clientes impõem um limite no comprimento da URL de 2083 caracteres. Outro problema é que informações que são passadas em uma QueryString podem ser violadas ou alteradas por usuários mal-intencionados. Portanto, não se deve transmitir dados importantes ou confidenciais via QueryString. Além disso, um usuário pode marcar um URL ou enviar o URL para outros usuários, assim, passando as informações juntamente com ele. Exemplo de leitura de uma QueryString: Dim codigo As Integer codigo = CInt(Request("cod_obra")) Opções de gerenciamento de estado baseado em servidor O ASP.NET oferece algumas maneiras de se manter informações do estado no servidor. Com o gerenciamento de estado baseado no servidor, você pode diminuir a quantidade de informações enviadas para o cliente para preservar o estado, mas em contra-partida, isso pode ter um alto custo para o servidor. As seções a seguintes descrevem três recursos de gerenciamento de estado com base em servidor: Application State, Session State e Profile Properties. Por estarem armazenadas no servidor, as informações contidas nesses gerenciadores de estados são seguras. Application State (Estado do Aplicativo) Application State é uma instância de classe HttpApplicationState — para cada aplicativo ativo da Web. O estado do aplicativo é um mecanismo de armazenamento global acessível de todas as páginas de aplicativo da Web. Assim, o estado do aplicativo é útil para armazenar informações que precisam ser mantidas entre requisições de ida e volta ao servidor e solicitações de páginas. O estado do aplicativo é armazenado em um dicionário chave/valor que é criado durante cada solicitação para uma determinada URL. Você pode adicionar suas informações específicas do aplicativo para essa estrutura para armazená-lo entre solicitações de página. Por ser comum a toda a aplicação e não a cada usuário, só se deve utilizar o Application quando a informação a ser armazenada é de interesse comum a todas as instâncias utilizadas. Session State (Estado da sessão) Uma Session é uma instância de classe HttpSessionState — para cada aplicativo ativo da Web. Uma Session funciona como o Application State visto anteriormente, exceto pelo fato de que ele é delimitado para a sessão atual do navegador. Se diferentes usuários estiverem usando o seu aplicativo, cada sessão de usuário terá um Session State diferente. Além disso, se um usuário deixa o seu aplicativo e, em seguida, se conecta novamente ao aplicativo, é criada uma nova sessão ao usuário, e esta será diferente da primeira sessão. Uma sessão é estruturada como um dicionário de chave/valor para armazenar informações específicas que precisam ser mantidas entre requisições ao servidor e solicitações de páginas. Você pode usar estado de sessão para realizar as seguintes tarefas: ● Identificar exclusivamente o navegador ou solicitações do dispositivo cliente e mapeá-los para uma instância individual da sessão no servidor. ● Armazenar dados específicos da sessão no servidor para uso nas várias solicitações do navegador ou dispositivo cliente dentro da mesma sessão. ● Disparar eventos de gerenciamento apropriados para a sessão. Uma vez que você adicionar suas informações específicas do aplicativo numa sessão, o servidor gerencia este objeto. Dependendo das opções que você especificar, informações da sessão podem ser armazenadas em um servidor fora de processo, ou em um computador executando o Microsoft SQL Server. Para se gravar valores em uma Sessão, podemos usar os seguintes comandos: Session.Add("usuario", "Maria") ou Session("usuario") = "Maria" Já para se ler o conteúdo de uma Sessão usa-se: Dim usu As String If Session("usuario") IsNot Nothing Then 'Verifica se a sessão existe usu = Session("usuario").ToString End If Profile Properties O ASP.NET oferece um recurso denominado Profile Properties, que permite armazenar dados específicos de um usuário. Este recurso se assemelha à Session, exceto que os dados de perfil não são perdidos quando uma sessão de usuário expira. O recurso do perfil é armazenado em um formato persistente e associado a um usuário individual. O perfil ASP.NET permite gerenciar informações do usuário sem exigir que seja criado e mantido seu próprio banco de dados. É possível armazenar objetos de qualquer tipo no perfil. O recurso de perfil ASP.NET fornece um sistema de armazenamento genérico que permite que você defina e mantenha praticamente qualquer tipo de dados enquanto ainda torna os dados disponíveis de uma maneira segura. Projeto desenvolvido em aula - Loja Virtual A solução desenvolvida em sala, é composta de 2 projetos. O LojaVirtual, é um projeto do tipo ASP.NET Web Application e que irá conter as páginas e toda a programação Web. Já o projeto Loja, é um projeto do tipo Class Library e será responsável pela regra de negócio e acesso ao banco de dados. Uma vez criado os 2 projetos, é necessário que o projeto que ASP.NET - LojaVirtual, referencie a DLL gerada pelo projeto Loja (ClassLibrary). Para isso, basta primeiro compilar a Solução (Build->Build Solution) e em seguida ir ao projeto LojaVirtual, e referenciar o projeto Loja (My Project do Loja Virtual -> References -> Add -> Projects). Feito isso para as páginas do projeto LojaVirtual que forem utilizar a DLL gerada pelo projeto Loja, é interessante incluir no início da página o comando Imports Loja. Com isso todos os métodos e propriedades públicos da DLL estarão disponíveis para uso. Links para estudos Html ● W3C - HTML 4.01 Specification: http://www.w3.org/TR/html401/ ● ICMC-USP - Tutorial HTML: http://www.icmc.usp.br/ensino/material/html/ ● Truques e dicas – Tutoriais de Html: http://www.truquesedicas.com/tutoriais/html/00001a.htm Css ● W3C - Cascading Style Sheets: http://www.w3.org/Style/CSS/ ● HTML.Net - Tutorial CSS: http://www.pt-br.html.net/tutorials/css/ ● W3Schools - CSS Tutorial: http://www.w3schools.com/css/ JavaScript ● W3Schools - JavaScript Tutorial: http://www.w3schools.com/js/default.asp ● W3Schools - JavaScript Reference: http://www.w3schools.com/jsref/default.asp ● Truques e Dicas – Tutorial de Java Script: http://www.truquesedicas.com/tutoriais/javascript/ ● Mozilla – Javascript: http://developer.mozilla.org/en/docs/About_JavaScript ● MSDN – Javascript: http://msdn2.microsoft.com/en-us/library/ms970435.aspx