GridView - add attribute problem with CSS Friendly Adapters turned on. RSS

• • Reply
  

  wamprat

  Member

  8 Points

  20 Posts

  GridView - add attribute problem with CSS Friendly Adapters turned on.

  Sep 25, 2009 01:39 AM|LINK

  I have  a gridview with friendly adapters enabled, the gridview is within an update panel.

  I have used the onRowDataBound event to color code the rows dependent upon a value and this works fine by assigning classnames.

  I would like to also have the row color change with a mouseover event. Now I have used some samples on the internet but have failed to make it work. In the end I disabled the friendly adapter on the gridview and the row coloring started working. When looking at the page source, with friendly adapters enabled the attribute is just not added.

  So there appears to be some issue adding attributes to a gridview row with css friendly adapters enabled.

  Does anyone know how to get the onmouseover attribute added to a row in a gridview with css friendly adapters enabled?

  
  

  Below is the code I am using in the RowCreated event handler

   

  Protected Sub GridView_Institutes_RowCreated(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView_Institutes.RowCreated
  
  
  If e.Row.RowType = DataControlRowType.DataRow Then
              ' when mouse is over the row, save original color to new attribute, and change it to highlight yellow color
              e.Row.Attributes.Add("onmouseover", "this.originalClassName=this.className; this.className='gridViewRowMouseOver';")
              ' when mouse leaves the row, change the bg color to its original value
              e.Row.Attributes.Add("onmouseout", "this.className=this.originalClassName;")
          End If
  End Sub

  Cheers
  
  

   

  • Edited by wamprat on Sep 25, 2009 03:12 AM
• • Reply
  

  vickyiori

  Member

  90 Points

  17 Posts

  Re: GridView - add attribute problem

  Sep 25, 2009 02:02 AM|LINK

  I prefer to use CSS for this kinda work. It's quie easy in these cases and no code behing code is required.

  /* mouseover row style */
  .datagrid tr:hover{ background-color:#f2e8da; }

  
  And apply the CSS class to the GridView..

  <asp:GridView .. CssClass="datagrid" >

  
  
  

  
  

  
  

  GridView MouseOver Color

  "I still live, I still think: I still have to live, for I still have to think."
  • Edited by vickyiori on Sep 25, 2009 02:03 AM
• • Reply
  

  wamprat

  Member

  8 Points

  20 Posts

  Re: GridView - add attribute problem

  Sep 25, 2009 02:13 AM|LINK

  Thanks Vickyiori, this has at least allowed me to get round this issue ( I have put your solution in place), however i am still keen to get a solution to the attribute addition problem.

  If I need to execute some clientside javascript based on a row event in the gridview it just is not possible.

   

• • Reply
  

  dotnetruler

  Contributor

  4230 Points

  753 Posts

  Re: GridView - add attribute problem

  Sep 25, 2009 02:17 AM|LINK

  try to do the same thing in GridView_RowDataBound event..

  I have done this.. but i did not use style sheets.. i just used the styles directly

   

  If e.Row.RowType = DataControlRowType.DataRow Then
      e.Row.Attributes("onmouseover") = "this.style.backgroundColor='lightblue';"
      e.Row.Attributes("onmouseout") = "this.style.backgroundColor='';"
      'e.Row.Attributes("onclick") = Page.ClientScript.GetPostBackClientHyperlink(TableGridView, "Select$" & e.Row.RowIndex)
      e.Row.Attributes("style") = "cursor:pointer"
  End If

   

  Better Post your code before asking a question. So that person helping u will understand u r problem Clearly
  
  Yahoo IM : dotnetruler
  
  I am trying to keep Frequently Asked Questions in my blog
• • Reply
  

  wamprat

  Member

  8 Points

  20 Posts

  Re: GridView - add attribute problem

  Sep 25, 2009 02:37 AM|LINK

   HI, thanks for this but I am afraid I have already tried this. Infact it was my first effort as I already use this event to assign the row color dependent upon data values by just setting the the row cssclass, which works. It just appears to be an issue when trying to add an attribute.

  Have you had the code above work on a gridview with CSS Friendly adapters on? As I say if I turn off friendly adapters the attributes are added, if friendly adapters is on then the attributes are not added. I have single step through the code and it all executes fine with now errors, just the output never makes it to the html.

   

  Below I show the code I have already for the RoDatabound event (I have added your code above, just incase I was missing something but it has not worked). Also below that code extract I show the html output with friendly adapter turned on and off.

  Protected Sub GridView_Institutes_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs)
  
  
          If e.Row.RowType = DataControlRowType.DataRow Then
  
  
              If Not DBNull.Value.Equals(e.Row.DataItem("inst_f")) Then
                  If (e.Row.DataItem("inst_f") = True) Then
                      e.Row.CssClass = "gridViewRowActive"
                  ElseIf (e.Row.DataItem("inst_f") = False) Then
                      e.Row.CssClass = "gridViewRowActiveNot"
                  End If
              End If
          End If
  
  
          If e.Row.RowType = DataControlRowType.DataRow Then
              e.Row.Attributes("onmouseover") = "this.style.backgroundColor='lightblue';"
              e.Row.Attributes("onmouseout") = "this.style.backgroundColor='';"
              e.Row.Attributes("style") = "cursor:pointer"
          End If
  
  
      End Sub

  HTML output with Friendly adapters on.

  <tbody>
  					<tr class="gridViewRowActive AspNet-GridView-Normal">
  						<td>
                                  <input type="submit" name="ctl00$ContentPlaceHolder1....

  HTML output with Friendly adapters off.

  <tr class="gridViewRowActive" onmouseover="this.style.backgroundColor='lightblue';" onmouseout="this.style.backgroundColor='';" style="cursor:pointer">
  				<td>
                                  <input type="submit" name="ctl00$ContentPlaceHolder1...

  • Edited by wamprat on Sep 25, 2009 02:39 AM
• • Reply
  

  dotnetruler

  Contributor

  4230 Points

  753 Posts

  Re: GridView - add attribute problem

  Sep 25, 2009 02:57 AM|LINK

  The code that i gave u works when adapters are not there..

  In associatio to that . i used a theme for the grid view.. which is technically a CSS class.. am not sure why it is ot working with u r case.

  Better Post your code before asking a question. So that person helping u will understand u r problem Clearly
  
  Yahoo IM : dotnetruler
  
  I am trying to keep Frequently Asked Questions in my blog
• • Reply
  

  wamprat

  Member

  8 Points

  20 Posts

  Re: GridView - add attribute problem

  Sep 25, 2009 03:11 AM|LINK

  Hi Dotnetruler,

  Your code does work for me with adapters turned off<not there> but I need to get this working with adapters on. All the styling for the application has been set for when the adapters are on, if I turn the adapters off the styling goes awry.

  Cheers 

• • Reply
  

  wamprat

  Member

  8 Points

  20 Posts

  Re: GridView - add attribute problem

  Sep 28, 2009 12:38 AM|LINK

  OK, I have been looking at this and I downloaded the latest patch 24242 from the codeplex website. On looking at GridViewAdapter.cs I found these few lines which I assume is why I am unable to add arbitrary attributes.

  //  Uncomment the following block of code if you want to add arbitrary attributes.
  /*
  	foreach (string key in row.Attributes.Keys)
  	{
  			writer.WriteAttribute(key, row.Attributes[key]);
  	}
  */

  
  I will try and rebuild this and let you know how it goes. I am not a true developer so not sure if I will be able to get this back into codeplex, I am using VS2008 and the code needs converting before I can edit, so not sure if that will mess up the codeplex. Anyway I post back here if I get this working.

  
  

  • Marked as answer by wamprat on Sep 28, 2009 01:01 AM
• • Reply
  

  wamprat

  Member

  8 Points

  20 Posts

  Re: GridView - add attribute problem

  Sep 28, 2009 01:00 AM|LINK

  This has solved my issue, I am unsure why this code is commented out, seems strange to me. I removed the comments and rebuilt the DLL. Hope this helps out someone else.

  
  

  p.s. thanks to all those who replied.

  
  

  Something has just occurred to me... It is probably because I am using the change set 24242 of CSS Friendly adapters that I was having this problem, at some stage it would appear that someone commented out the attribute lines. There is no comment about the logic for commenting it out.

  I imagine if you are using the original version then this probably is not a problem.

  
  

  p.s. additional

  As an aside I have actually gone with the stylesheet method for coloring my rows (as suggested by vickyiori), it performs a lot faster in IE than the javascript method. Still at least now I can add arbitrary attributes to my rows...

  • Edited by wamprat on Sep 28, 2009 01:01 AM
  • Edited by wamprat on Sep 28, 2009 01:03 AM
  • Edited by wamprat on Sep 28, 2009 01:05 AM
  • Edited by wamprat on Sep 28, 2009 01:38 AM
• • Reply
  

  ejcortes

  Member

  2 Points

  1 Post

  Re: GridView - add attribute problem

  Apr 15, 2010 06:57 PM|LINK

  Thanks a lot. First Google result... Fixed my problem.