none
GridView RRS feed

  • Pergunta

  • Pessoal, bom dia.
    Seguinte, tenho um gridview que utilizo os seguinte comandos para mudar a cor da linha onde o mouse estiver em cima.

    e.Row.Attributes.Add(

    "onMouseOver","this.style.backgroundColor='#ffff00';this,style.cursor='hand';");

    e.Row.Attributes.Add(

    "onMouseOut", "this.style.backgroundColor='#ffffff'");

    No entanto, eu preciso poder selecionar a linha e deixa-la com o fundo amarelo como feito em OnMouseOver.
    Tentei habilitar a opção allowsorting e mudar na opção onselectedrowstyle o atributo backcolor, mas não deu certo.


    Alguem poderia me ajudar?

    Grato desde já
    Gustavo


    Analista Programador
    segunda-feira, 11 de janeiro de 2010 10:52

Respostas

  • Tente,
    Evento rowCreated da gridview
            if ((e.Row.RowType == DataControlRowType.DataRow) && (e.Row.RowIndex != this.gdvDados.EditIndex))
            {
                e.Row.Attributes.Add("onmouseover", "changeBackColor(this, true, 'SelectedRowStyle');");
                e.Row.Attributes.Add("onmouseout", "changeBackColor(this, false, '');");
            }
    Javascript:

    var lastColorUsed; function changeBackColor(row, highlight, classe) { if (highlight) { lastColorUsed = row.className; row.className = classe; } else { row.className = lastColorUsed; } }

    Abraço
    • Marcado como Resposta Harley Araujo quarta-feira, 13 de janeiro de 2010 09:50
    segunda-feira, 11 de janeiro de 2010 11:48
  • Gustavo,

    Assim é possível fazer porém você desabilita o evento onmouseout.

    e.Row.Attributes.Add(

    "onMouseOver", "this.style.backgroundColor='#ffff00';this,style.cursor='hand';");
    e.Row.Attributes.Add(
    "onMouseOut", "this.style.backgroundColor='#ffffff'");
    e.Row.Attributes.Add(
    "onClick", "this.style.backgroundColor='#ffff00';this.style.cursor='hand'; this.onmouseout=function(){}");

    Pelo que entendi sua linha não fica selecionada pois o evento onmouseout deixa a linha toda branca novamente, da forma acima funciona porém não tem como desmarcar a linha, se você utilizar um comando para desmacar a linha implementa a função onmouseout novamente.

    []´s

    segunda-feira, 11 de janeiro de 2010 12:24
  • Tirar a seleção do GRID?
    R.: Você teria que ter outro evento para desmarcar a linha, ai você precisaria habilitar o evento onMouseOut novamente.


    Gostaria de usar um checkbox que esta no itemtemplate do gridview para selecionar e desmarcar a linha
    R.: No CheckedChanged do CheckBox você pode fazer um evento para marcar a linha:

    asp:GridView ID="gvSkip" runat="server" ShowHeader="true" ShowFooter="false" AutoGenerateColumns="true"
                    OnRowDataBound="gvSkip_RowDataBound">
                    <Columns>
                        <asp:CommandField ButtonType="Button" HeaderText="Excluir" DeleteText="Excluir" ShowDeleteButton="true" />
                        <asp:TemplateField >
                        <ItemTemplate>
                            <asp:CheckBox ID="chkSelect" runat="server" AutoPostBack="true" />
                        </ItemTemplate>
                        </asp:TemplateField>
                    </Columns>
                
                </asp:GridView>
    protected void gvSkip_RowDataBound(object sender, GridViewRowEventArgs e)
        {
            if (e.Row.RowType == DataControlRowType.DataRow)
            {
                CheckBox chkSelect = (CheckBox)e.Row.FindControl("chkSelect");
                if (chkSelect != null)
                {
                    chkSelect.CheckedChanged += new EventHandler(chkSelect_CheckedChanged);
                    chkSelect.Attributes.Add("RowIndex", e.Row.RowIndex.ToString());
                }
    
                e.Row.Attributes.Add("onMouseOver", "this.style.backgroundColor='#ffff00';this,style.cursor='hand';");
                e.Row.Attributes.Add("onMouseOut", "this.style.backgroundColor='#ffffff'");
                e.Row.Attributes.Add("onClick", "this.style.backgroundColor='#ffff00';this.style.cursor='hand'; this.onmouseout=function(){}");
    
        }
    
        protected void chkSelect_CheckedChanged(object sender, EventArgs e)
        {
            CheckBox chkSelect = (CheckBox)sender;
    
            if (chkSelect != null)
            {
                if (chkSelect.Checked)
                {
                    int rowIndex = int.part(chkSelect.Attributes["RowIndex"]);
    
                    this.gvSkip.Rows[rowIndex].Attributes.Add("onMouseOver", "this.style.backgroundColor='#ffff00';this,style.cursor='hand';");
                    this.gvSkip.Rows[rowIndex].Attributes.Add("onMouseOut", "this.style.backgroundColor='#ffffff'");
                    this.gvSkip.Rows[rowIndex].Attributes.Add("onClick", "this.style.backgroundColor='#ffff00';this.style.cursor='hand'; this.onmouseout=function(){}");
                }
            }
        }
    
    Falando nisso, tem como eu fixar o onClick para funcionar apenas se o usuário clicar em determinada coluna do grid?
    R.: Você pode fazer desta forma mas se vai utilizar checkbox aconselho utilizar uma função para marcar e desmarcar o checkbox.
    e.Row.Cells[colunaFixar].Attributes.Add("onClick", "this.style.backgroundColor='#ffff00';this.style.cursor='hand'; this.onmouseout=function(){}");

    []´s
    segunda-feira, 11 de janeiro de 2010 16:43

Todas as Respostas

  • Amigo,

    Já tentou colocar SelectedRowStyle?

    <SelectedRowStyle BackColor="#ffff00" />

    []´s

    segunda-feira, 11 de janeiro de 2010 11:09
  • Já tentei sim..... vc saberia me dizer como eu faço isso usando o row.atribute? Tipo, quando usuário clicar sobre a linha....

    e.Row.Attributes.Add(

    "??????","this.style.backgroundColor='#ffff00';this,style.cursor='hand';");

    Grato desde já
    Gustavo


    Analista Programador
    segunda-feira, 11 de janeiro de 2010 11:41
  • Gustavo,

    Ficaria assim:
    e.Row.Attributes.Add("onClick","this.style.backgroundColor='#ffff00';this,style.cursor='hand';");

    []´s

     

    segunda-feira, 11 de janeiro de 2010 11:45
  • Tente,
    Evento rowCreated da gridview
            if ((e.Row.RowType == DataControlRowType.DataRow) && (e.Row.RowIndex != this.gdvDados.EditIndex))
            {
                e.Row.Attributes.Add("onmouseover", "changeBackColor(this, true, 'SelectedRowStyle');");
                e.Row.Attributes.Add("onmouseout", "changeBackColor(this, false, '');");
            }
    Javascript:

    var lastColorUsed; function changeBackColor(row, highlight, classe) { if (highlight) { lastColorUsed = row.className; row.className = classe; } else { row.className = lastColorUsed; } }

    Abraço
    • Marcado como Resposta Harley Araujo quarta-feira, 13 de janeiro de 2010 09:50
    segunda-feira, 11 de janeiro de 2010 11:48
  • Tiago, desde já obrigado pela ajuda!
    Mas dessa maneira o OnMouseOut acaba por tirar a cor da seleção do OnClick...como eu faria para os dois funcionarem juntos?
    Grato desde já
    Gustavo
    Analista Programador
    segunda-feira, 11 de janeiro de 2010 11:50
  • Gustavo,

    Assim é possível fazer porém você desabilita o evento onmouseout.

    e.Row.Attributes.Add(

    "onMouseOver", "this.style.backgroundColor='#ffff00';this,style.cursor='hand';");
    e.Row.Attributes.Add(
    "onMouseOut", "this.style.backgroundColor='#ffffff'");
    e.Row.Attributes.Add(
    "onClick", "this.style.backgroundColor='#ffff00';this.style.cursor='hand'; this.onmouseout=function(){}");

    Pelo que entendi sua linha não fica selecionada pois o evento onmouseout deixa a linha toda branca novamente, da forma acima funciona porém não tem como desmarcar a linha, se você utilizar um comando para desmacar a linha implementa a função onmouseout novamente.

    []´s

    segunda-feira, 11 de janeiro de 2010 12:24
  • Tiago, de fato funcionou, só não entendi como tirar a seleção.... gostaria de usar um checkbox que esta no itemtemplate do gridview para selecionar e desmarcar a linha......
    falando nisso, tem como eu fixar o onClick para funcionar apenas se o usuário clicar em determinada coluna do grid?

    Grato desde já
    Gustavo

    Analista Programador
    segunda-feira, 11 de janeiro de 2010 16:10
  • Tirar a seleção do GRID?
    R.: Você teria que ter outro evento para desmarcar a linha, ai você precisaria habilitar o evento onMouseOut novamente.


    Gostaria de usar um checkbox que esta no itemtemplate do gridview para selecionar e desmarcar a linha
    R.: No CheckedChanged do CheckBox você pode fazer um evento para marcar a linha:

    asp:GridView ID="gvSkip" runat="server" ShowHeader="true" ShowFooter="false" AutoGenerateColumns="true"
                    OnRowDataBound="gvSkip_RowDataBound">
                    <Columns>
                        <asp:CommandField ButtonType="Button" HeaderText="Excluir" DeleteText="Excluir" ShowDeleteButton="true" />
                        <asp:TemplateField >
                        <ItemTemplate>
                            <asp:CheckBox ID="chkSelect" runat="server" AutoPostBack="true" />
                        </ItemTemplate>
                        </asp:TemplateField>
                    </Columns>
                
                </asp:GridView>
    protected void gvSkip_RowDataBound(object sender, GridViewRowEventArgs e)
        {
            if (e.Row.RowType == DataControlRowType.DataRow)
            {
                CheckBox chkSelect = (CheckBox)e.Row.FindControl("chkSelect");
                if (chkSelect != null)
                {
                    chkSelect.CheckedChanged += new EventHandler(chkSelect_CheckedChanged);
                    chkSelect.Attributes.Add("RowIndex", e.Row.RowIndex.ToString());
                }
    
                e.Row.Attributes.Add("onMouseOver", "this.style.backgroundColor='#ffff00';this,style.cursor='hand';");
                e.Row.Attributes.Add("onMouseOut", "this.style.backgroundColor='#ffffff'");
                e.Row.Attributes.Add("onClick", "this.style.backgroundColor='#ffff00';this.style.cursor='hand'; this.onmouseout=function(){}");
    
        }
    
        protected void chkSelect_CheckedChanged(object sender, EventArgs e)
        {
            CheckBox chkSelect = (CheckBox)sender;
    
            if (chkSelect != null)
            {
                if (chkSelect.Checked)
                {
                    int rowIndex = int.part(chkSelect.Attributes["RowIndex"]);
    
                    this.gvSkip.Rows[rowIndex].Attributes.Add("onMouseOver", "this.style.backgroundColor='#ffff00';this,style.cursor='hand';");
                    this.gvSkip.Rows[rowIndex].Attributes.Add("onMouseOut", "this.style.backgroundColor='#ffffff'");
                    this.gvSkip.Rows[rowIndex].Attributes.Add("onClick", "this.style.backgroundColor='#ffff00';this.style.cursor='hand'; this.onmouseout=function(){}");
                }
            }
        }
    
    Falando nisso, tem como eu fixar o onClick para funcionar apenas se o usuário clicar em determinada coluna do grid?
    R.: Você pode fazer desta forma mas se vai utilizar checkbox aconselho utilizar uma função para marcar e desmarcar o checkbox.
    e.Row.Cells[colunaFixar].Attributes.Add("onClick", "this.style.backgroundColor='#ffff00';this.style.cursor='hand'; this.onmouseout=function(){}");

    []´s
    segunda-feira, 11 de janeiro de 2010 16:43