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
If
End
Sub
5 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
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
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.UI
Imports
System.Data
Partial
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
Sub
End
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.