quarta-feira, 25 de janeiro de 2012

Manipulando HTML com a Classe HtmlGenericControl e o Comando FindControl

    As vezes precisamos manipular o HTML para adicionar novas funções ou alterar o layout criado, neste post pretendo mostrar uma forma de se fazer isto.
    O comando FindControl é utilizado para localizar um controle, para que este comando funcione em projetos WEB precisamos no ASP.Net definir um ID e colocar o atributo runat=”server” conforme os exemplos abaixo:
 class="xml"><!-- runat="server" em uma div -->
<div class="menu" id="divMenu" runat="server">

<!-- runat="server" no body, repare que eu adicionei o atributo ID ao body -->
<body runat="server" id="body">
    O atributo runat=”server” pode ser adicionado em qualquer parte do HTML, este atributo server para informar que o controle (TAG HTML) vai ficar disponível no código do lado do servidor.
    Feito isso segue alguns exemplo do uso do comando FindControl : 
// Pegando um controle ul 
HtmlGenericControl ulPrincipal = (HtmlGenericControl)FindControl("ulPrincipal");

// Pegando o body da página (o body deve conter o atributo ID e o atributo runat="server", conforme mencionado acima) 
HtmlGenericControl pgBody = (HtmlGenericControl)FindControl("body");
    Como a proposta deste artigo é a manipulação de controles HTML verifique que eu converti o controle localizado para a classe HtmlGenericControl, está classe vai nos ajudar a manipular os atributos do controle HTML, abaixo segue alguns exemplos de atributos que podemos manipular:
// Adicionando uma classe CSS
liLinhaF.Attributes.Add("class", "linha-menu");

// Adicionando um titulo, o conteúdo e o link de um controle a
aHref.Attributes.Add("title", "Titulo"); // Titulo
aHref.Attributes.Add("href", "link"); // link
aHref.InnerText = "Conteudo" // Conteúdo 

// Adicionando código HTML ao controle
liLinha.InnerHtml = " ";

// Adicionando o evento onload ao body da página
pgBody.Attributes.Add("onload", "javascript:alert(\'teste !\')");

// Manipulando o estilo de um controle HTML
lu.Style.Add("display", "none");
lu.Style.Add("visibility", "hidden");
    Além de manipular atributos também podemos adicionar outros controles dentro de outros controles (caso você tenha uma div ou table):
HtmlGenericControl ulPrincipal = (HtmlGenericControl)FindControl("ulPrincipal");
HtmlGenericControl liLinha = new HtmlGenericControl("li");
liLinha.Attributes.Add("class", "linha-menu");
liLinha.InnerHtml = "<B>Teste</B>";
ulPrincipal.Controls.Add(liLinha);
    Com o comando FindControl e a classe HtmlGenericControl fica muito fácil a manipulação do HTML do lado do servidor.

Referências:
Método Control.FindControl (String)
Classe HtmlGenericControl
Curso ASP.NET 3.5 em VB.NET e C# - Controles(Fernando Amaral)
Apply CSS for an HTML generic control like
Postado por às Nenhum comentário :
Marcadores:

domingo, 15 de janeiro de 2012

Configurando o JQuery no Visual Studio 2008

    O JQuery, na minha opinião, é uma das melhores bibliotecas em Javascript, facilitando muita a vida do desenvolvedor, neste artigo vou mostrar como fazer a integração do JQuery ao Visual Studio 2008 para que o intelisense funcione, já que tive algumas dificuldades nesta integração.
    Primeiro verifique se o seu Visual Studio 2008 está  com o SP1 instalado.
    Segue o link se você precisar baixar o SP1 do Visual Studio 2008 (a instalação deste pacote é lenta, não estranhe):


    Depois vamos aplicar o hotfix para o Visual Studio interpretar a documentação de bibliotecas escritas em Javascript (-vsdoc.js), o endereço para fazer o download do hotfix é :


    Baixe os arquivos do JQuery: jquery-1.3.2-vsdoc2.js e jquery-1.3.2.js (está é a versão que eu usei neste artigo), no endereço http://code.google.com/p/jqueryjs/downloads/list. Retire do nome do arquivo de documentação o numero dois ele deve ficar com o seguinte nome jquery-1.3.2-vsdoc.js (é importante renomear este arquivo, porque o Visual Studio só interpreta arquivos de documentação se ele tiver no final do nome a sequencia "-vsdoc.js").
    Depois de feito o download dos arquivos e aplicado o hotfix, vamos testar o Visual Studio 2008, crie um projeto WEB, depois crie uma pasta chamada scripts (não é obrigatório, mas fica mais organizado), insira neste diretório os dois arquivos do JQuery , arraste ou insira a referência ao arquivo que contem as funções (jquery-1.3.2.js).
    Crie uma sessão Javascript e digite $( e veja o intelisense funcionando !


Referências:
Postado por às Um comentário :
Marcadores: ,
Assinar: Postagens ( Atom )