Hi,
How would i change the labels for the grid editor controls ?
What i am trying to change is the forecolor of a controls label.
I have successfully added a RequiredFieldValidator to a control within the grid editor, but i would like the label of the control to always be red.
Is this possible ? If so, please can you help (i'm sure you can !)
Many Thanks
Mark :-)
How would i change the labels for the grid editor controls ?
What i am trying to change is the forecolor of a controls label.
I have successfully added a RequiredFieldValidator to a control within the grid editor, but i would like the label of the control to always be red.
Is this possible ? If so, please can you help (i'm sure you can !)
Many Thanks
Mark :-)
8 Answers, 1 is accepted
0
Hi Mark,
If you are using a popup edit form or a normal edit form, you should use the following CSS rule:
div.GridEditForm_Skin
{
color : .... ;
}
If you are using InPlace editing, the CSS should read:
tr.GridEditRow_Skin
{
color : .... ;
}
Regards,
Dimo
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.
If you are using a popup edit form or a normal edit form, you should use the following CSS rule:
div.GridEditForm_Skin
{
color : .... ;
}
If you are using InPlace editing, the CSS should read:
tr.GridEditRow_Skin
{
color : .... ;
}
Regards,
Dimo
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Mark
Top achievements
Rank 1
Rank 1
answered on 13 Aug 2008, 12:52 PM
Hi,
Maybe i'm being stupid here, but how do i implement this ??
I'm using in place editing, but what is tr ??
tr.GridEditRow_Skin
{
color : .... ;
}
Mark
Maybe i'm being stupid here, but how do i implement this ??
I'm using in place editing, but what is tr ??
tr.GridEditRow_Skin
{
color : .... ;
}
Mark
0
Hi Mark,
You need to add the above CSS rule to your web application - either in a <style> tag in the <head> section of your web page, or in an external CSS file. Don't forget to replace Skin with the name of the skin that you are using for RadGrid in the particular scenario.
tr means table row, this is the HTML tag used for table row elements. In our case the tr type selector is used to increase the specificity of the CSS rule, so that the color style overrides the skin's color style.
If you need some more information on CSS concepts, please refer to:
Introduction to CSS
CSS Selectors
Sincerely yours,
Dimo
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.
You need to add the above CSS rule to your web application - either in a <style> tag in the <head> section of your web page, or in an external CSS file. Don't forget to replace Skin with the name of the skin that you are using for RadGrid in the particular scenario.
tr means table row, this is the HTML tag used for table row elements. In our case the tr type selector is used to increase the specificity of the CSS rule, so that the color style overrides the skin's color style.
If you need some more information on CSS concepts, please refer to:
Introduction to CSS
CSS Selectors
Sincerely yours,
Dimo
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Mark
Top achievements
Rank 1
Rank 1
answered on 13 Aug 2008, 01:10 PM
Hi,
i understand css and tr.
But i'm struggling to see how to implement this to affect individual edit form labels.
I have 3 GridBoundColumns. (1 read-only)
when i select edit button, the 2 columns are shown with the Headertext as the label in black.
I want 1 of these labels to be red. (required field)
From your code, i do not understand how i achieve this via server code.
Mark
i understand css and tr.
But i'm struggling to see how to implement this to affect individual edit form labels.
I have 3 GridBoundColumns. (1 read-only)
when i select edit button, the 2 columns are shown with the Headertext as the label in black.
I want 1 of these labels to be red. (required field)
From your code, i do not understand how i achieve this via server code.
Mark
0
Hi Mark,
I didn't realize you wanted to make all this server-side. In this case, here is an example:
ASPX
C#
All the best,
Dimo
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.
I didn't realize you wanted to make all this server-side. In this case, here is an example:
ASPX
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" |
| "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
| <html xmlns="http://www.w3.org/1999/xhtml" > |
| <head runat="server"> |
| <meta http-equiv="content-type" content="text/html; charset=utf-8" /> |
| <title>RadGrid for ASP.NET AJAX</title> |
| </head> |
| <body> |
| <form id="form1" runat="server"> |
| <asp:ScriptManager ID="ScriptManager1" runat="server" /> |
| <asp:XmlDataSource ID="XmlDataSource1" runat="server"> |
| <Data> |
| <nodes> |
| <node col1="col 1 text" col2="col 2 text" /> |
| <node col1="col 1 text" col2="col 2 text" /> |
| <node col1="col 1 text" col2="col 2 text" /> |
| </nodes> |
| </Data> |
| </asp:XmlDataSource> |
| <telerik:RadGrid |
| ID="RadGrid1" |
| runat="server" |
| GridLines="None" |
| DataSourceID="XmlDataSource1" |
| AutoGenerateColumns="false" |
| OnItemCreated="RadGrid1_ItemCreated"> |
| <MasterTableView> |
| <Columns> |
| <telerik:GridEditCommandColumn HeaderText="Edit" /> |
| <telerik:GridBoundColumn DataField="col1" HeaderText="col1" /> |
| <telerik:GridBoundColumn DataField="col2" HeaderText="col2" /> |
| </Columns> |
| </MasterTableView> |
| </telerik:RadGrid> |
| </form> |
| </body> |
| </html> |
C#
| protected void RadGrid1_ItemCreated(object sender, GridItemEventArgs e) |
| { |
| if (e.Item is GridEditableItem && e.Item.IsInEditMode) |
| { |
| Table mainEditTable = ((e.Item as GridEditableItem).Controls[1].Controls[0].Controls[0] as Table).Rows[1].Cells[0].Controls[0] as Table; |
| mainEditTable.Rows[0].Cells[0].ForeColor = System.Drawing.Color.Blue; |
| mainEditTable.Rows[1].Cells[0].ForeColor = System.Drawing.Color.Red; |
| } |
| } |
All the best,
Dimo
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Steve Newbery
Top achievements
Rank 1
Rank 1
answered on 13 Nov 2008, 10:50 AM
So is there no way to declaratively set the width of the captions in a PopUp edit form?
I tried using FormCaptionStyle CssClass and Width, but they have no effect.
Steve
I tried using FormCaptionStyle CssClass and Width, but they have no effect.
Steve
0
Hello Steve,
I am afraid there is no way to declaratively set the widths of labels in an autogenerated edit form, however, you can use a template edit form or a user control edit form and customize them according to your preferences:
http://demos.telerik.com/aspnet/prometheus/Grid/Examples/DataEditing/TemplateFormUpdate/DefaultCS.aspx
http://demos.telerik.com/aspnet/prometheus/Grid/Examples/DataEditing/UserControlEditForm/DefaultCS.aspx
FormCaptionStyle is intended to style the edit form's title, which appears above all labels and textboxes.
Regards,
Dimo
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.
I am afraid there is no way to declaratively set the widths of labels in an autogenerated edit form, however, you can use a template edit form or a user control edit form and customize them according to your preferences:
http://demos.telerik.com/aspnet/prometheus/Grid/Examples/DataEditing/TemplateFormUpdate/DefaultCS.aspx
http://demos.telerik.com/aspnet/prometheus/Grid/Examples/DataEditing/UserControlEditForm/DefaultCS.aspx
FormCaptionStyle is intended to style the edit form's title, which appears above all labels and textboxes.
Regards,
Dimo
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Steve Newbery
Top achievements
Rank 1
Rank 1
answered on 19 Nov 2008, 08:33 PM
Thanks for the reply Dimo - yes I'm now using a FormTemplate for the popup, which is fine as now I have complete control over the layout.
Best, Steve