DataGrid Rollover Colors, select single, select multiple rows client side RSS

• • Reply
  anzer

  Contributor

  4387 Points

  1407 Posts

  DataGrid Rollover Colors, select single, select multiple rows client side

  May 17, 2005 09:06 AM|anzer|LINK

  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
  
  If this post was useful to you, please mark it as answer.
  
  ClientSideAsp.Net | Blog
• • Reply
  anzer

  Contributor

  4387 Points

  1407 Posts

  Re: DataGrid Rollover Colors, select single, select multiple rows client side

  May 18, 2005 02:29 AM|anzer|LINK

  
  Ok now its working I removed all the smilies
  
  If this post was useful to you, please mark it as answer.
  
  ClientSideAsp.Net | Blog
• • Reply
  eXtension

  Member

  176 Points

  738 Posts

  Re: DataGrid Rollover Colors, select single, select multiple rows client side

  May 18, 2005 11:57 PM|eXtension|LINK

  Could someone post a vb.net version of that?
  
  Microsoft ASP.NET Enthusiast