This is a migrated thread and some comments may be shown as answers.

Template of columnMenu has changed in 2013 version which prevent to skin checkbox column Menu

3 Answers 44 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Cedric
Top achievements
Rank 1
Cedric asked on 04 Jul 2013, 03:52 PM
Hi,
I' trying to upgrade kendo from version 2012.2.913 to 2013.1.514 and i've noticed that the template used to generate the column menu has changed from :
'<li><label><input type="checkbox" data-#=ns#field="#=columns[col].field#" data-#=ns#index="#=columns[col].index#"/>#=columns[col].title#</label></li>'+
to 
'<li><input type="checkbox" data-#=ns#field="#=columns[col].field#" data-#=ns#index="#=columns[col].index#"/>#=columns[col].title#</li>'
The suppression of the label in the template makes my little snippet of jsscript to mal function: this script is used to skin the checkbox displayed in the column menu:
// First put the label BEFORE the input
var
chkIdCounter = 1;
$(
"label > input[type='checkbox']").each(function () {
       $(
this).attr("id", "labeledCheckBox" + chkIdCounter);
       $(
this).parent().attr("for", "labeledCheckBox" + chkIdCounter++);
       $(
this).insertBefore($(this).parent().parent().find($(this).parent()));});
and the we use the 'sprite trick' to skin the checkbox: 
/* then hide the input and display a sprite in place */
input[type=
"checkbox"]
{
    position: absolute;   
    display: none;
}
input[type="checkbox"]:checked ~ label::before
{
    background-position: 0 -20px;
}
/* skin-specific sprite */
input[type="checkbox"] ~ label::before
{
    background-image: url('itesoft/radios.png');
}

So i've 2 questions, please:
First, i'm curious to know why the label has been deleted, is it a wrong way to use checkbox ?
Then i would want to know if there is an other way to skin the checkbox of the column menu or to provide the template to use to build them ?

Thanks,
Cedric 

3 Answers, 1 is accepted

Sort by
0
Accepted
Alexander Valchev
Telerik team
answered on 08 Jul 2013, 03:45 PM
Hello Cedric,

Thank you for getting in touch with us.

The column menu template is not documented and is intended for internal usage only. Undocumented parts of the framework are usually changed without official warning. As a general information, the change which you noticed is connected with the keyboard navigation support.

I am afraid that currently Kendo Grid does not provide opportunity for changing the appearance or the template of the column menu. There is support for localizing the text labels only:

Regards,
Alexander Valchev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Cedric
Top achievements
Rank 1
answered on 09 Jul 2013, 08:04 AM
Hi Alexander,
Thanks a lot for the explanation so I will try to skin my checkbox in another way.

Have a good day
Ced.

0
Cedric
Top achievements
Rank 1
answered on 09 Jul 2013, 08:10 AM

Tags
Grid
Asked by
Cedric
Top achievements
Rank 1
Answers by
Alexander Valchev
Telerik team
Cedric
Top achievements
Rank 1
Share this question
or