none
GridView com JavaScript RRS feed

  • Pergunta

  • Olá pessoal tranquilo, quero vê quem pode me ajudar nessa,...

    É o seguinte: Criei uma página aspx e nela coloquei um GridView.
    Na primeira coluna do GridView tem um TemplateField com CheckBox;
    Ao Clicar nos CheckBoxs dos Itens da Gridview ele muda a cor da linha selecionada;
    Até ai tranquilo;
    Só que no checkbox do Header eu tenho que mudar a cor de todas as linhas de uma só vez,
    Alguem ai tem um javascript pra fazer isso?

    Só ta faltando isso,...ao clicar no checkbox do Header tenho que mudar a cor de todas as linhas ao mesmo tempo

    Desde já agradeço,...
    quarta-feira, 25 de junho de 2008 16:23

Respostas

  • Foi mal esqueci desta parte!

    Protected Sub grd_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles grd.RowDataBound
            If e.Row.RowType = DataControlRowType.DataRow Then
                Dim Chk As CheckBox = e.Row.FindControl("chk")
                Page.ClientScript.RegisterStartupScript(Me.GetType(), "ScriptChk", "CorLinhaSelecionada", True)
                Chk.Attributes.Add("onClick", "CorLinhaSelecionada(this,'" + Convert.ToString(e.Row.RowState) + "' );")    '4
            End If
        End Sub

    sua templatecolumn deve ficar assim:
     <ItemTemplate>
                 <asp:CheckBox ID="chk" runat="server" />
        </ItemTemplate>
    <ItemStyle CssClass="itemGrid" HorizontalAlign="Center" />
           <HeaderTemplate>
          <input id="chkAll" onclick="javascriptTongue TiedelecionaTodosChecks(this,'nomegrd');" runat="server" type="checkbox" />
          </HeaderTemplate>
        </asp:TemplateField>
    quarta-feira, 25 de junho de 2008 17:52

Todas as Respostas

  • Cara use esse script para selecionar todos, qdo clicar no check do hearder:
      <script language=javascript>
     function SelecionaTodosChecks(spanChk,grd){ 
       var oItem = spanChk.children;
       var theBox= (spanChk.type=="checkbox") ?
            spanChk : spanChk.children.item[0];
       xState=theBox.checked;
       elm=theBox.form.elements;
       for(i=0;i<elm.length;i++){
       var t = elm[  i].id.indexOf("_");
       idGrd = elm[ i ].id.substring(0,t);
         if(elm[ i].type=="checkbox" &&
                  idGrd==grd)
         {
           if(elm[ i].checked!=xState)
             elm[i ].click();
         }
        }
     }
     
     </script>

      <HeaderTemplate>
          <input id="chkAll" onclick="javascriptTongue TiedelecionaTodosChecks(this,'nomeDogrid');" runat="server" type="checkbox" />
       </HeaderTemplate>

    e essa para mudar a cor da linha, mas vc falou que ja tem né?

    function CorLinhaSelecionada(corChk, RowState){
           if (corChk.checked)
                 corChk.parentElement.parentElement.style.backgroundColor='#ffaa63';
           else {
                 if (RowState=='0')
                        corChk.parentElement.parentElement.style.backgroundColor='#EEEEEE';
                 else
                        corChk.parentElement.parentElement.style.backgroundColor='Gainsboro';
                 }
    }
    quarta-feira, 25 de junho de 2008 16:47
  • Bom, valeu pelo código amigo, só que não era bem isso que eu queria,..

    O código pra selecionar todos os checks eu já tenho, só queria acrescentar o codigo para colorir o fundo de todas as linhas do gridview, é só em relação a cor, a marcação dos checks eu já tenho,..

    Obrigado,...


    quarta-feira, 25 de junho de 2008 16:51
  • Então a função que te passei  a segunda serve para mudar a cor do fundo da linha selecionada e se vc selecionar todas as linhas todas mudaram a cor de fundo, não é isso q vc precisa?
    quarta-feira, 25 de junho de 2008 17:09
  • Mas se eu tiver um GridView com 500 linhas eu vou ter que clicar em uma por uma pra mudar a cor?

    Eu também já tenho o código pra quando clicar em apenas um item mudar a cor de fundo da linha.

    Eu queria apenas clicar no checkbox do Header e mudar todas as cores de fundo das 500 linhas de uma só vez, entendeu, esse código da pra fazer isso?


    quarta-feira, 25 de junho de 2008 17:14
  • Então, mas é isso que as funções q te passei fazem, se vc clicar na check do header será selecionadas todas a linhas e consequentemente mudará a cor do fundo delas!
    quarta-feira, 25 de junho de 2008 17:32
  • Blz, eu copiei o código , mas quando eu clico no check do header ele não seleciona nenhum dos outros checks, não acontece nada, é só esse código mesmo, não tem que fazer mais nada?
    quarta-feira, 25 de junho de 2008 17:42
  • Foi mal esqueci desta parte!

    Protected Sub grd_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles grd.RowDataBound
            If e.Row.RowType = DataControlRowType.DataRow Then
                Dim Chk As CheckBox = e.Row.FindControl("chk")
                Page.ClientScript.RegisterStartupScript(Me.GetType(), "ScriptChk", "CorLinhaSelecionada", True)
                Chk.Attributes.Add("onClick", "CorLinhaSelecionada(this,'" + Convert.ToString(e.Row.RowState) + "' );")    '4
            End If
        End Sub

    sua templatecolumn deve ficar assim:
     <ItemTemplate>
                 <asp:CheckBox ID="chk" runat="server" />
        </ItemTemplate>
    <ItemStyle CssClass="itemGrid" HorizontalAlign="Center" />
           <HeaderTemplate>
          <input id="chkAll" onclick="javascriptTongue TiedelecionaTodosChecks(this,'nomegrd');" runat="server" type="checkbox" />
          </HeaderTemplate>
        </asp:TemplateField>
    quarta-feira, 25 de junho de 2008 17:52
  • Blz cara, só tem uma coisa.

    Na função "SelecionaTodosChecks(spanChk,grd)" o valor de idGrd==grd nunca é igual ai ele não entra no if.

    Obs: o parametro "grd" recebe normal o nome da minha GridView que é "grdRel", já a variavel idGrid recebe outros nomes mas numca o nome da minha grid.

    Você sabe porque?

    quarta-feira, 25 de junho de 2008 17:58
  • Blz cara descobri, eu apenas tinha que mudar essa parte do código

    idGrd = elmIdea.id.substring(0,t);

    para

    idGrd=elmIdea.id.substring(40,46);

    porque eu to usando masterpager e WebUserControl.

    Valeu cara agora deu certo!

    Muito Obrigado.
    • Sugerido como Resposta Raquel Faria terça-feira, 12 de junho de 2012 19:51
    quarta-feira, 25 de junho de 2008 18:27
  • Olá

    Por exemplo eu tenho um java scrpit que quando eu seleciono uma linha no grid ele muda a cor é esse

    <script language="javascript" type="text/javascript">
         function changeColor(obj) {
             var tr = obj.parentNode.parentNode; // acrescentar ou retirar parentNode de acordo com seu HTML
             tr.style.backgroundColor = (obj.checked) ? 'white' : '';
         }   
      </script>

    Na templatecolumn

    <Columns>
                <asp:TemplateField>
                    <HeaderTemplate>
                        <asp:CheckBox ID="chkDelete" runat="server" AutoPostBack="True"
                            oncheckedchanged="CheckBox1_CheckedChanged" />
                    </HeaderTemplate>
                    <ItemTemplate>
                        <asp:CheckBox ID="CheckBox2" runat="server" />
                    </ItemTemplate>
                </asp:TemplateField>
            </Columns>

    O que devo acrescentar no código abaixo para ele pegar CheckBox1 e colorir todas as linhas do CheckBox2 porque pelo CheckBox2 ele colori por linha.

        protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
        {
                CheckBox ch = ((CheckBox)e.Row.FindControl("CheckBox2"));

                if (ch != null)
                {
                    ch.Attributes.Add("onclick", "changeColor(this);");
                }
            }


    • Editado dralmves domingo, 19 de agosto de 2012 16:26
    domingo, 19 de agosto de 2012 16:19