locked
DataGrid Rollover Colors, select single, select multiple rows client side RRS feed

  • Question

  • User845932231 posted
    Iam just adding some more lines to JakeJeck's post  http://forums.asp.net/792635/ShowPost.aspx

    Put this in a class file
            public static DataGridItem ApplyRowRollover(DataGridItem item , string MouseOverColor , string MouseOutColor, string MouseClickColor )
            {
                item.Attributes.Add("onmouseover", "ChangeColorOver(this,'" + MouseOverColor + "','" + MouseClickColor + "');");
                item.Attributes.Add("onmouseout", "ChangeColorOut(this,'" + MouseOutColor + "','" + MouseClickColor + "');" );
                item.Attributes.Add("onmouseup", "ChangeColorClick(this,'" + MouseOutColor + "','" + MouseClickColor + "' );");
                return item;
            }
    Import your class file and call it in your ItemDataBound routine
                  private void DGshoppingHistory_ItemDataBound(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e)
            {
                string MouseOverColor="#FFC0FF";
                string MouseOutColor="#C0C0FF";
                string MouseClickColor= "blue";

                if (e.Item.ItemType != ListItemType.Header && e.Item.ItemType != ListItemType.Footer)
                    ColorClass.ApplyRowRollover(e.Item,MouseOverColor ,MouseOutColor,MouseClickColor);
            }

    Add these functions in the HTML section of the page
    <script>
    function ChangeColorOver(obj,clrO,clrC)
    {
       if(obj.style.backgroundColor!=clrC)
      {
          obj.style.backgroundColor=clrO;
       }
    }

    function ChangeColorOut(obj,clrO,clrC)
    {
           if(obj.style.backgroundColor!=clrC)
          {
                obj.style.backgroundColor=clrO;
           }
     }

    function ChangeColorClick(obj, clrO, clrC)
    {
    //--Delete lines from here  if you want multiple selection
       var tableID='DGshoppingHistory'  //your datagrids id
       var table;
       if (document.all) table=document.all[tableID];
       if (document.getElementById) table=document.getElementById(tableID);
       if (table)
      {
        for ( var i = 1 ;  i < table.rows.length-1 ;  i++)
            table.rows [ i ] . style . backgroundColor = "clrO";
      }
    //--Delete lines till here if you want multiple selection
      obj.style.backgroundColor = clrC;
    }
    </script>

    Write server side code on SelectedIndexChanged if you want to process the selected item
    server side.

    Adios
    Anz
    Tuesday, May 17, 2005 9:06 AM

All replies

  • User845932231 posted

    Ok now its working I removed all the smilies
    Wednesday, May 18, 2005 2:29 AM
  • User-1858836523 posted
    Could someone post a vb.net version of that?
    Wednesday, May 18, 2005 11:57 PM