I have a grid with telerik:GridBoundColumn where I try to change the text color to red.
If the text data is unformatted it works, but not if the text is HTML Code / is a url.
Have tried with ItemStyle-ForeColor="Red" and:
If the text data is unformatted it works, but not if the text is HTML Code / is a url.
Have tried with ItemStyle-ForeColor="Red" and:
Protected Sub RadGrid1_ItemDataBound(sender As Object, e As GridItemEventArgs) If TypeOf e.Item Is GridDataItem Then Dim dataItem As GridDataItem = TryCast(e.Item, GridDataItem) Dim myCell As TableCell = dataItem("FormularUrl") myCell.ForeColor = Color.Red End IfEnd Sub5 Answers, 1 is accepted
0
Hello Kjell,
If the content of the cell is not plain text, you may have to set a CSS class to the TableCell element and style the content of the cell with CSS:
And with the CSS you can apply your own styles:
Hope this helps.
Regards,
Konstantin Dikov
Telerik
If the content of the cell is not plain text, you may have to set a CSS class to the TableCell element and style the content of the cell with CSS:
item("FormularUrl").CssClass = "urlStyle"And with the CSS you can apply your own styles:
<style type="text/css"> .urlStyle { color: #ffd800; .... } .urlStyle a { color: #ffd800; .... }</style>Hope this helps.
Regards,
Konstantin Dikov
Telerik
Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.
0
Kjell
Top achievements
Rank 1
Iron
Iron
answered on 29 Jan 2015, 11:26 AM
Sorry, not work.....
If I understand you correctly:
And in the head:
If I understand you correctly:
<telerik:GridBoundColumn DataField="FormularUrl" HeaderStyle-Width="86px" HeaderText="Fyll i direkt!" ItemStyle-CssClass="urlStyle" />And in the head:
<style type="text/css"> .urlStyle { color: red; } .urlStyle a { color: red; }</style>0
Hi Kjell,
The same code is working as expected on my end and it is changing the color of text in that column:
And the CSS is the same as in the previous example.
Can you please provide a very basic example with dummy data that replicates the problem and also, elaborate on the version of our controls that you are currently using. Thus we will be able to test it locally and isolate the root of the problem.
Regards,
Konstantin Dikov
Telerik
The same code is working as expected on my end and it is changing the color of text in that column:
<telerik:RadGrid runat="server" ID="RadGrid1" OnNeedDataSource="RadGrid1_NeedDataSource"> <MasterTableView AutoGenerateColumns="false"> <Columns> <telerik:GridBoundColumn DataField="FormularUrl" HeaderStyle-Width="86px" HeaderText="Fyll i direkt!" ItemStyle-CssClass="urlStyle" /> </Columns> </MasterTableView></telerik:RadGrid>And the CSS is the same as in the previous example.
Can you please provide a very basic example with dummy data that replicates the problem and also, elaborate on the version of our controls that you are currently using. Thus we will be able to test it locally and isolate the root of the problem.
Regards,
Konstantin Dikov
Telerik
Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.
0
Kjell
Top achievements
Rank 1
Iron
Iron
answered on 03 Feb 2015, 10:11 AM
version: 2014.3.1209.45
default.aspx
Default.aspx.vb
default.aspx
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %><!DOCTYPE HTML><html lang="sv"><head runat="server"> <meta charset="iso-8859-1"> <title>Blankettbanken</title> <style type="text/css"> .urlStyle { color: red; } .urlStyle a { color: green; } </style></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server" /> <div> <telerik:RadGrid ID="RadGrid1" GridLines="None" OnNeedDataSource="RadGrid1_NeedDataSource" runat="server"> <MasterTableView AutoGenerateColumns="False"> <Columns> <telerik:GridBoundColumn DataField="ID" HeaderText="ID" ItemStyle-ForeColor="Blue" /> <telerik:GridBoundColumn DataField="Test" HeaderText="Test" ItemStyle-CssClass="urlStyle" /> <telerik:GridBoundColumn DataField="MyUrl" HeaderText="MyUrl" ItemStyle-CssClass="urlStyle" /> </Columns> </MasterTableView> </telerik:RadGrid> </div> </form></body></html>Default.aspx.vb
Imports Telerik.Web.UIImports System.DataPartial Class _Default Inherits System.Web.UI.Page Protected Sub RadGrid1_NeedDataSource(sender As Object, e As GridNeedDataSourceEventArgs) Dim table As New DataTable() table.Columns.Add("ID", GetType(Integer)) table.Columns.Add("Test", GetType(String)) table.Columns.Add("MyUrl", GetType(String)) For i As Integer = 0 To 4 table.Rows.Add(i, "Test", "<a href='http://www.telerik.com/forums/aspnet-ajax' target='_top'>Till formulär</a>") Next TryCast(sender, RadGrid).DataSource = table End SubEnd Class
0
Hi Kjell,
Thank you for providing an example that replicates the issue.
Actually, what is preventing the anchor element to be styled with the custom CSS that we are using is the fact that the styles that comes from the SKIN are with higher priority and are overriding the custom styles. You can handle this by one of the following approaches:
1) Adding "!important" at the end of the property:
2) Increasing the specificity of the selector:
Hope this fixes the issue on your end too.
Best Regards,
Konstantin Dikov
Telerik
Thank you for providing an example that replicates the issue.
Actually, what is preventing the anchor element to be styled with the custom CSS that we are using is the fact that the styles that comes from the SKIN are with higher priority and are overriding the custom styles. You can handle this by one of the following approaches:
1) Adding "!important" at the end of the property:
.urlStyle a { color: green!important;}2) Increasing the specificity of the selector:
div.RadGrid .urlStyle a { color: green;}Hope this fixes the issue on your end too.
Best Regards,
Konstantin Dikov
Telerik
Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.
