Este artigo tem nota
10
Versão para Impressão
Enviar por E-mail
Adicionar em Favoritos
Assine nossos Feeds

Conheça o Autor

francke
FRANCKE
PEIXOTO
membro deste setembro de 2007.

Palavras-Chave

ASP.NET
Formulário
JavaScript

Leia sobre

JavaScript: a Bíblia
Compartilhe e guarde
  • Rec6
  • StumbleUpon
  • ueba
  • linkk
  • dihitt
  • linkloko
  • websapiens
  • linkto
  • Technorati
  • Simpy
  • del.icio.us
  • Faves: Fave It!
ASP.NET

Selecionando Linhas de forma dinâmica dentro do GridView

domingo, 10 de fevereiro de 2008
Imagine um cenário onde um GridView com 15 colunas e um checkbox em cada linha para selecionar.

Toda vez que precisarmos selecionar uma linha do GridView seria um saco! Pois caso o checkbox esteja na última coluna, o ato de selecionar vira algo não muito confortável.

A partir de agora, criaremos um mecanismo que facilitará nossa vida ao selecionar cada linha de um GridView!

Código JavaScript:

function Selecionar(elemento,cordefundo)
    {
        var Inputs = elemento.getElementsByTagName("input");
        var cor = elemento.style.backgroundColor; //manter a cor default do elemento
        for(var i = 0; i < Inputs.length; ++i)
        {
            if(Inputs[i].type == 'checkbox')
            {
                Inputs[i].checked = !Inputs[i].checked;
                elemento.style.backgroundColor = cordefundo;
                elemento.onclick = function()
                {
                    Selecionar(this,cor);
                };         
            }         
        }       
    }


No script acima, recebo a referência da linha [elemento] do controle [GridView] em seguinda obtenho todos os inputs do elemento.
Depois que encontro o meu CheckBox, efetuo a operação desejada [selecionar/desselecionar] em seguida mudo a cor de fundo do elemento e modifico o evendo onclick.

Adicionando a função Selecionar(elemento,cordefundo) nas Linhas do GridView:

No PreRender do GridView adicione o código abaixo.

protected void gvSelecao_PreRender(object sender, EventArgs e){
        GridView gv = (GridView)sender;
        foreach (GridViewRow row in gv.Rows)
            row.Attributes.Add("onclick", "Selecionar(this,'#FFFF00');");
        }


Aqui estamos adicionando nossa função em cada linha de nosso GridView.

Com essa implementação só precisamos clicar na linha para selecionar nosso checkbox.

Até o próximo artigo!
ArquivoTipoTamanho 
Selecionando_Checkboxs_de_forma_dinâmica_dentro_do_GridView_doc.zipArquivo ZIP53,8 KbBaixar o Arquivo
Sim   Não   Este artigo foi útil para você?
NotaComentárioMembro
10
2/1/2009
Legal
demais essa video aula
 comibrain
Regras:
Os comentários seguem as seguintes regras:
  • Todos os comentários são enviados por membros cadastrados no site.
  • Os comentários serão pré-aprovados, porém a equipe do site revisará o conteúdo de todos os comentários podendo ser invalidados (inclusive a pontuação).
  • Os comentários precisam ter, obrigatóriamente, coerência sobre o conteúdo que será comentado.
  • O membro que atingir 10 comentários invalidados não poderá mais comentar dentro do site. Com isso o membro não poderá mais ganhar pontos com comentários.

Comente

     (ainda não tem cadastro? clique aqui!)

Máximo de 30 caracteres

Máximo de 255 caracteres