This is a migrated thread and some comments may be shown as answers.

GridTableRow gradient style

11 Answers 63 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Mat
Top achievements
Rank 1
Mat asked on 27 Mar 2012, 08:28 AM
Hy,

I want to draw programmatically colors to GridTableRow on RadGrid.ItemDataBound event. Switch my bounded item status, I call this method with different colors :

private void SetItemBackgroundColor(GridDataItem _item, string _sBackgroundColor, string _sGradientColor = null, string _sFontColor = null)
{
  if (string.IsNullOrEmpty(_sGradientColor) || _sBackgroundColor == _sGradientColor)
  {
    _item.Style.Add(HtmlTextWriterStyle.BackgroundColor, _sBackgroundColor);
  }
  else
  {
    _item.Style.Add("filter", " progid:DXImageTransform.Microsoft.gradient(startColorStr=" + _sBackgroundColor + ", endColorStr=" + _sGradientColor + ", GradientType=1)");
    _item.Style.Add("background", "-moz-linear-gradient(left, " + _sBackgroundColor + ", " + _sGradientColor + ")");
    //_item.Style.Add(HtmlTextWriterStyle.Height, "auto");
  }
 
  if (!string.IsNullOrEmpty(_sFontColor))
  {
    _item.Style.Add(HtmlTextWriterStyle.Color, _sFontColor);
  }
}

It works well under Firefox, but doesn't work in IE.

I used this link but it doesn't work for GridTableRow. I can't found properties described in this post !

Thanks for your help !

11 Answers, 1 is accepted

Sort by
0
Andrey
Telerik team
answered on 30 Mar 2012, 08:15 AM
Hi,

You could check this help topic which explains how to customize row appearance.

All the best,
Andrey
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Mat
Top achievements
Rank 1
answered on 30 Mar 2012, 09:48 AM
Thank you for the answer, but it is not described how to draw a "grandient-style".

Any idea ?
0
Andrey
Telerik team
answered on 30 Mar 2012, 02:33 PM
Hi,

You could combine the approach from the link I have provided with the information from the page you have found and thus you will be able to achieve your goal.

I have created a project to illustrate the approach. Give the project a try and check whether this is the desired behavior.

Greetings,
Andrey
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Mat
Top achievements
Rank 1
answered on 08 May 2012, 12:21 PM
Hi,

I'm back to this Post :).

The problem for me is not to apply a style to a row or another object. The problem is that gradient-style doesn't work properly on GridTableRow... I see in source code that my style is applied, but it is not displayed...

Thanks in advance,
Stéphane
0
Andrey
Telerik team
answered on 08 May 2012, 03:34 PM
Hello,

How and whether the gradient will be shown is up to the browser. What browser you are using and what is its version?

Greetings,
Andrey
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Mat
Top achievements
Rank 1
answered on 08 May 2012, 03:40 PM
It works fine in Firefox 12 & Safari, but doesn't work in IE9.
0
Andrey
Telerik team
answered on 08 May 2012, 04:08 PM
Hi,

You could check this StackOverflow conversion for more information on gradients in IE9.

All the best,
Andrey
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Mat
Top achievements
Rank 1
answered on 14 May 2012, 09:37 AM
Thanks for this link. I tried it but doesn't draw a gradient in RadGridItem. I've tried many many css custom styles but I never can draw gradient in IE...

Does anybody have already drawn gradient from left to right in a raw in RadGrid ?
0
Andrey
Telerik team
answered on 16 May 2012, 04:03 PM
Hi,

Since the issue you are experiencing is a browser behavior and most probably won't be fixed before the next version is released, I will suggest to draw a gradient over an image and use this image in your website instead of dynamically generate the gradient in the browser.

Regards,
Andrey
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Mat
Top achievements
Rank 1
answered on 21 May 2012, 04:30 PM
Hi,

Using images whith gradient will show other issues (width, height which are dynamic, transparency, hover style, ...). I can't use this solution.

I don't think that my issue is a browser problem because my code works well in buttons or panel, but doesn't work in RadGridItem.

Let me know if you have a solution.

Regards,
Stéphane
0
Andrey
Telerik team
answered on 24 May 2012, 12:40 PM
Hi,

When sent to the browser each item of RadGrid is rendered as a HTML tr element. You could inspect what is the rendered HTML and the applied styles through some web inspector like FireBug.

You could try to place your code in a normal HTML table and check whether it is displayed correctly. Another approach is to try to set empty skin to RadGrid.

Give these suggestions a try and check whether the issue still replicates.

Greetings,
Andrey
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Tags
Grid
Asked by
Mat
Top achievements
Rank 1
Answers by
Andrey
Telerik team
Mat
Top achievements
Rank 1
Share this question
or