This question is locked. New answers and comments are not allowed.

Patrick Barranis
Top achievements
Rank 1
Patrick Barranis
asked on 17 Mar 2011, 03:36 PM
Hi. I was recently trying to figure out why, in a brand new project, the Grid was "losing" some of its styling. Our designer tracked it down to missing classes on the table - "t-widget t-grid". That was because our grid is defined with the following line of code:
With previous version of the grid we have done this and it added those two classes to the other two classes that are on the grid by default ("t-widget t-grid"). But on the version we're now on (2010.3.1318.340) it appears we have to do the following to get the grid to render correctly:
Is this correct or did we do something wrong?
Thanks,
Patrick
.HtmlAttributes(new { Class = "SelectionGrid QuickFilterGrid" })
With previous version of the grid we have done this and it added those two classes to the other two classes that are on the grid by default ("t-widget t-grid"). But on the version we're now on (2010.3.1318.340) it appears we have to do the following to get the grid to render correctly:
.HtmlAttributes(new { Class = "SelectionGrid QuickFilterGrid t-widget t-grid" })
Is this correct or did we do something wrong?
Thanks,
Patrick
12 Answers, 1 is accepted
0
Accepted
Hello Patrick,
Please use
.HtmlAttributes(new { @class = "myClass" })
Greetings,
Dimo
the Telerik team
Please use
.HtmlAttributes(new { @class = "myClass" })
Greetings,
Dimo
the Telerik team
0

Rob
Top achievements
Rank 1
answered on 17 Mar 2011, 04:31 PM
That's right @class helps, but it doesn't solve the problem. The new release overwrites the standard classes (e.g. t-header).
Best regard
Rob
Best regard
Rob
0

Patrick Barranis
Top achievements
Rank 1
answered on 17 Mar 2011, 05:13 PM
Dimo, thanks. That's very unintuitive, but it works.
Rob, it appears that Dimo was right - using the lowercase "class" causes the lists to merge, not to overwrite the standard/default classes.
Thanks.
Rob, it appears that Dimo was right - using the lowercase "class" causes the lists to merge, not to overwrite the standard/default classes.
Thanks.
0
Hi Patrick,
There is no HTML attribute called Class - it should be written with a small letter.
@Rob - you are right about the HeaderHtmlAttributes, we have already fixed this.
Greetings,
Dimo
the Telerik team
There is no HTML attribute called Class - it should be written with a small letter.
@Rob - you are right about the HeaderHtmlAttributes, we have already fixed this.
Greetings,
Dimo
the Telerik team
0

Patrick Barranis
Top achievements
Rank 1
answered on 17 Mar 2011, 05:48 PM
Hi Dimo,
I appreciate the help, but I'm 99% certain that HTML <= 4 is case insensitive. Only XHTML (includes HTML 5+) introduced case-sensitivity into HTML only due to XML being case-sensitive.
So to remain compatible with non-XHTML sites "Class" and "class" should be treated identically. VB being a case-insensitive language only complicates things further (though this project uses C#, which I admit I prefer).
You can also find a very thorough analysis of this situation as it affects XHTML by John Resig (leader of the jQuery project): http://ejohn.org/blog/nodename-case-sensitivity/
HTH. I do appreciate the help!
-pb
I appreciate the help, but I'm 99% certain that HTML <= 4 is case insensitive. Only XHTML (includes HTML 5+) introduced case-sensitivity into HTML only due to XML being case-sensitive.
So to remain compatible with non-XHTML sites "Class" and "class" should be treated identically. VB being a case-insensitive language only complicates things further (though this project uses C#, which I admit I prefer).
You can also find a very thorough analysis of this situation as it affects XHTML by John Resig (leader of the jQuery project): http://ejohn.org/blog/nodename-case-sensitivity/
HTH. I do appreciate the help!
-pb
0
Hi Patrick,
Our MVC extensions eventually render both @class and Class with a small letter, which is HTML compliant.
What is different from the MVC framework is that we currently do not throw an exception if you use @class and Class at the same time, and the second key provided is used. We will research why this happens.
All the best,
Dimo
the Telerik team
Our MVC extensions eventually render both @class and Class with a small letter, which is HTML compliant.
What is different from the MVC framework is that we currently do not throw an exception if you use @class and Class at the same time, and the second key provided is used. We will research why this happens.
All the best,
Dimo
the Telerik team
0
Hello again,
Here is a follow-up on the discussed matter. We have found why we don't throw an exception if one sets Class and @class at the same time and have fixed this.
However, currently if a component's HTML element renders a native CSS class and you add another CSS class with Class = "...", this will result in the following HTML output:
<tagname Class="your-class" class="native-class">...</tagname>
As a result, the second attribute will be ignored and the component will not look as expected.
Supporting this scenario by merging the two class attributes turns out to be rather cumbersome, so we will not support it and I strongly recommend everybody to use @class only.
All the best,
Dimo
the Telerik team
Here is a follow-up on the discussed matter. We have found why we don't throw an exception if one sets Class and @class at the same time and have fixed this.
However, currently if a component's HTML element renders a native CSS class and you add another CSS class with Class = "...", this will result in the following HTML output:
<tagname Class="your-class" class="native-class">...</tagname>
As a result, the second attribute will be ignored and the component will not look as expected.
Supporting this scenario by merging the two class attributes turns out to be rather cumbersome, so we will not support it and I strongly recommend everybody to use @class only.
All the best,
Dimo
the Telerik team
0

Patrick Barranis
Top achievements
Rank 1
answered on 18 Mar 2011, 02:05 PM
Thanks very much for the great customer service and the follow-up!
Personally I think the exception would be better since you know the current design will just cause a problem when being rendered. A poignant error message would save users from having to rediscover this same problem themselves - potentially saving quite a few hours of busy people's time...
But the decision is up to you! Thanks again.
Personally I think the exception would be better since you know the current design will just cause a problem when being rendered. A poignant error message would save users from having to rediscover this same problem themselves - potentially saving quite a few hours of busy people's time...
But the decision is up to you! Thanks again.
0

Zoli
Top achievements
Rank 1
answered on 08 Apr 2011, 10:16 AM
Hello,
I have a problem with HtmlAttributes when I try to use the columns.Command(...).HtmlAttribute(...), it never adds any attribute for CommandColumns.
Do you have any suggestion?
Or, is it a bug?
Thanks
Zoli
RazorCode example:
I have a problem with HtmlAttributes when I try to use the columns.Command(...).HtmlAttribute(...), it never adds any attribute for CommandColumns.
Do you have any suggestion?
Or, is it a bug?
Thanks
Zoli
RazorCode example:
@(Html.Telerik().Grid(Model)
.Name("gridExample")
.DataKeys(keys => keys.Add(m => m.CountryId))
.Columns(columns =>
{
columns.Command(command => command.Edit()).HtmlAttributes(new {@class ="RightAlign"});
})
.DataBinding(dataBinding => dataBinding.Ajax().Update("Edit", "Country"))
)
<style type=
"text/css"
>
.RightAlign
{
text-align
:
right
;
}
</style>
0
Hi Zoli,
Indeed, this is a bug (related only to Command columns), however, we have recently identified it and fixed it. You can try using the latest internal build.
Regards,
Dimo
the Telerik team
Indeed, this is a bug (related only to Command columns), however, we have recently identified it and fixed it. You can try using the latest internal build.
Regards,
Dimo
the Telerik team
Do you want to have your say when we set our development plans?
Do you want to know when a feature you care about is added or when a bug fixed?
Explore the
Telerik Public Issue Tracking
system and vote to affect the priority of the items
0

Shruti
Top achievements
Rank 1
answered on 18 Jan 2012, 10:24 AM
hi,
i am a designer and wanted to do some customization in telerik controls.
I applied a class on mvc telerik grid:
Html.Telerik().Grid<OrderViewModel>()
.Name("UploadOrderLocGrid")
.HtmlAttributes(new { @class = "myClass" })
.Columns(columns =>
strangely on some pages it is showing the class in firebug, and in some it is not, any idea, why it is behaving like this?
<div id="UploadOrderLocGrid" height="100px" class="t-widget t-grid">
i am a designer and wanted to do some customization in telerik controls.
I applied a class on mvc telerik grid:
Html.Telerik().Grid<OrderViewModel>()
.Name("UploadOrderLocGrid")
.HtmlAttributes(new { @class = "myClass" })
.Columns(columns =>
strangely on some pages it is showing the class in firebug, and in some it is not, any idea, why it is behaving like this?
<div id="UploadOrderLocGrid" height="100px" class="t-widget t-grid">
0

Aurel
Top achievements
Rank 1
answered on 12 Mar 2012, 11:25 AM
Hi am trying to add click event to a tab
@Html.Telerik().TabStrip().Name("TabStrip").Items(Sub(items) items.Add.Text("Application").HtmlAttributes("onclick:onSelect").Content(Html.Partial("ApplicationContent").ToHtmlString())
how can i rewrite HtmlAttributes("onclick:onSelect") in vbhtml?
@Html.Telerik().TabStrip().Name("TabStrip").Items(Sub(items) items.Add.Text("Application").HtmlAttributes("onclick:onSelect").Content(Html.Partial("ApplicationContent").ToHtmlString())
how can i rewrite HtmlAttributes("onclick:onSelect") in vbhtml?