Question

Zunächst einmal habe ich ein Kendo-Gitter. Jetzt bin ich dynamisch ein Kontrollkästchen, um die Datasource das Hinzufügen wie unten:

var chkBox = "<input type='checkbox' id='chUpload'/><label for='chUpload'><a href='#' id='cbChoose'></a>test</label>"; 

var uploadedFiles = 
[ 
    { 
     facility: "Sunrise medical Laboratories", 
     documentName: "Lab Results", 
     documentType: "PDF", 
     selected: chkBox 
    } 
]; 

Im Folgenden sind die Stile auf die Checkbox implementiert:

input[type="checkbox"] 
{ 
    display:none; 
} 

input[type="checkbox"] + label a 
{ 
    display:inline-block; 
    width:14px; 
    height:14px; 
    margin:-1px 4px 0 0; 
    vertical-align:middle; 
    background:url('../images/checkBox.png') right top no-repeat; 
    cursor:pointer; 
    float:right; 
    margin-top:10px; 
    margin-right:10px; 
} 

input[type="checkbox"]:checked + label a 
{ 
    background:url('../images/checkBox.png') -1px top no-repeat; 
} 

Ich fand, dass diese Stile auf andere Kontrollkästchen Arbeit, die ich hinzugefügt, um eine Panelbar Registerkarten, aber im Raster, nichts angezeigt wird.

Ich habe ein jsfiddle mit dem Black Boxes ist die gestylten Checkbox erstellt. Ich habe die display:none; in der CSS versteckt, um zu sehen, wo alle Textfelder sind. Wenn es verwendet wird, werden keine benutzerdefinierten Kontrollkästchen im Raster angezeigt.

Irgendwelche Ideen warum?

Answer 1

Ich habe das Problem gefunden.

template: "#= selected #" 

, die ein einfacher Fehler von mir war:

template: "<input type='checkbox' style='margin-right:23px; margin-top:0px;' />" 

sollte.

Hier ist eine funktionierende example.