Hi,
I am trying to set the width of a GridTemplateColumn from a stylesheet rather than in the aspx page but it doesnt seem to work. For instance the below code works to set the GridTemplateColumn width to 30 pixels.
However, The following code does not:
Is there a way around this problem? Or am i doing something wrong?
Thanks,
Michael
I am trying to set the width of a GridTemplateColumn from a stylesheet rather than in the aspx page but it doesnt seem to work. For instance the below code works to set the GridTemplateColumn width to 30 pixels.
<
telerik:GridTemplateColumn
AllowFiltering
=
"false"
UniqueName
=
"DeleteRecord"
HeaderStyle-Width
=
"30px"
>
<
ItemTemplate
>
<
asp:ImageButton
ID
=
"btnDeleteRecord"
runat
=
"server"
ImageUrl
=
"../../Common/Images/Icons/small/delete.gif"
CommandName
=
"DeleteRecord"
CssClass
=
"CursorHand"
/>
</
ItemTemplate
>
</
telerik:GridTemplateColumn
>
However, The following code does not:
<
telerik:GridTemplateColumn
AllowFiltering
=
"false"
UniqueName
=
"DeleteRecord"
HeaderStyle-CssClass
=
"commandHeader"
>
<
ItemTemplate
>
<
asp:ImageButton
ID
=
"btnDeleteRecord"
runat
=
"server"
ImageUrl
=
"../../Common/Images/Icons/small/delete.gif"
CommandName
=
"DeleteRecord"
CssClass
=
"CursorHand"
/>
</
ItemTemplate
>
</
telerik:GridTemplateColumn
>
.commandHeader
{
width
:
30px
;
}
Is there a way around this problem? Or am i doing something wrong?
Thanks,
Michael
10 Answers, 1 is accepted
0
Jayesh Goyani
Top achievements
Rank 2
answered on 09 Jan 2012, 05:35 PM
Hello,
Method 1:
Method 2:
Thanks,
Jayesh Goyani
Method 1:
<
telerik:GridTemplateColumn
>
<
ItemTemplate
>
<
asp:ImageButton
Width
=
"99px"
/>
</
ItemTemplate
>
<
ItemStyle
CssClass
=
"MyClass"
/>
<
HeaderStyle
CssClass
=
"MyClass"
/>
</
telerik:GridTemplateColumn
>
<style type=
"text/css"
>
.MyClass
{
width :
100px
!important
;
}
</style>
Method 2:
<
telerik:GridTemplateColumn
>
<
ItemTemplate
>
<
asp:ImageButton
Width
=
"99px"
/>
</
ItemTemplate
>
<
ItemStyle
Width
=
"100px"
/>
<
HeaderStyle
Width
=
"100px"
/>
</
telerik:GridTemplateColumn
>
Thanks,
Jayesh Goyani
0
Hello,
To achieve your goal you should use the CSS code snippet below:
Give it a try and let me know how it goes.
All the best,
Pavlina
the Telerik team
To achieve your goal you should use the CSS code snippet below:
<style type=
"text/css"
>
div.RadGrid_Default .commandHeader,
div.RadGrid_Default th.rgResizeCol
{
width
:
30px
;
}
</style>
Give it a try and let me know how it goes.
All the best,
Pavlina
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
Michael
Top achievements
Rank 1
answered on 09 Jan 2012, 06:12 PM
Hi,
Thanks for your response but I still couldn't get this working. Please see the below zip file for a sample project. If you take a look at lines 31 and 32, line 32 doesn't seem to size the column correctly. However, if you comment line 32 out and uncomment line 31 it will size as expected.
http://dl.dropbox.com/u/13207221/TelerikRadGridTestCorrect.zip
Many Thanks,
Michael
Edit: Linked the wrong project zip file. The above is now correct.
Thanks for your response but I still couldn't get this working. Please see the below zip file for a sample project. If you take a look at lines 31 and 32, line 32 doesn't seem to size the column correctly. However, if you comment line 32 out and uncomment line 31 it will size as expected.
http://dl.dropbox.com/u/13207221/TelerikRadGridTestCorrect.zip
Many Thanks,
Michael
Edit: Linked the wrong project zip file. The above is now correct.
0
Hello Michael,
I am afraid I was not able to replicate the problem you are facing while using commandHeader CSSClass. In the both cases the application is working properly. Please watch this video and let me know if I am leaving something out while testing.
All the best,
Pavlina
the Telerik team
I am afraid I was not able to replicate the problem you are facing while using commandHeader CSSClass. In the both cases the application is working properly. Please watch this video and let me know if I am leaving something out while testing.
All the best,
Pavlina
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
Michael
Top achievements
Rank 1
answered on 10 Jan 2012, 12:25 PM
Hi,
If you look in your video at 0:16 the size of the highlighted area is different to the size of the highlighted area at 1:01. However, These should be the same if it is reading the style correctly. I suspect that the size of the box at 0:16 is not actually 30 pixels.
I am trying to make my icons appear and position the same as they do at 1:01 but using a stylesheet not hardcoded in the aspx page.
Thanks,
Michael
If you look in your video at 0:16 the size of the highlighted area is different to the size of the highlighted area at 1:01. However, These should be the same if it is reading the style correctly. I suspect that the size of the box at 0:16 is not actually 30 pixels.
I am trying to make my icons appear and position the same as they do at 1:01 but using a stylesheet not hardcoded in the aspx page.
Thanks,
Michael
0
Accepted
Hello,
Indeed you are right that the column is wider while using a stylesteet. However, to be able to set the desired width you should remove left and right paddings as shown below:
Regards,
Pavlina
the Telerik team
Indeed you are right that the column is wider while using a stylesteet. However, to be able to set the desired width you should remove left and right paddings as shown below:
div.RadGrid_Default .commandHeader,
div.RadGrid_Default th.rgResizeCol
{
width
:
30px
;
padding-left
:
0px
;
padding-right
:
0px
;
}
Regards,
Pavlina
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
Michael
Top achievements
Rank 1
answered on 16 Jan 2012, 12:25 PM
Brilliant, I have now got this working. For anyone else who's interested, having TableLayout="Fixed" will also causes issues with using CSS like the above. In a couple of our grids this stumped me. Understandably once I realised the mistake it was easily fixed but worth noting for anyone else :)
Thanks once again,
Michael
Thanks once again,
Michael
0
Jaya
Top achievements
Rank 1
answered on 06 Feb 2015, 06:25 AM
Hi
How to Implemented Filter and Sorting Radgrid using Datatable in C# Code for example my field this
ex:Name,Empno,Amout,Dob Fields
any one guide me how will do this?
Thanks
for supports to all
How to Implemented Filter and Sorting Radgrid using Datatable in C# Code for example my field this
ex:Name,Empno,Amout,Dob Fields
any one guide me how will do this?
Thanks
for supports to all
0
Jaya
Top achievements
Rank 1
answered on 06 Feb 2015, 07:34 AM
Hi
How to Implemented Telerik Grid Bind Records using List object i seen this code
<asp:SqlDataSource runat="server" ID="SqlDataSource1" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>" SelectCommand="Select OrderID, OrderDate, ShipVia, ShipName, ShipAddress, ShipCity, ShipCountry FROM Orders"></asp:SqlDataSource>
but here i canot pass my stored procedure how so i move bind the records to server side c# then how to sorting , Filtering Concept using Telerik Grid
any one guide me post the code thats helpful for me
How to Implemented Telerik Grid Bind Records using List object i seen this code
<asp:SqlDataSource runat="server" ID="SqlDataSource1" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>" SelectCommand="Select OrderID, OrderDate, ShipVia, ShipName, ShipAddress, ShipCity, ShipCountry FROM Orders"></asp:SqlDataSource>
but here i canot pass my stored procedure how so i move bind the records to server side c# then how to sorting , Filtering Concept using Telerik Grid
any one guide me post the code thats helpful for me
0
Hi Jaya,
I already answered the other forum thread you have opened on the subject:
http://www.telerik.com/forums/how-to-implemented-filter-and-sorting-radgrid
Regards,
Pavlina
Telerik
I already answered the other forum thread you have opened on the subject:
http://www.telerik.com/forums/how-to-implemented-filter-and-sorting-radgrid
Regards,
Pavlina
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.