Zunächst einmal habe ich ein Kendo-Gitter. Jetzt bin ich dynamisch ein Kontrollkästchen, um die Datasource das Hinzufügen wie unten:Css - Benutzerdefinierte Stil auf Kontrollkästchen funktioniert nicht
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?
Sie müssen den Vorlagenwert entfernen, der anstelle der chkBox-Variablen platziert wird. Beispiel: Vorlage: " " – anpsmn
Ich habe gerade festgestellt, dass ich sowohl Feld und Vorlage habe. Wenn die Vorlage entfernt wird, interpretiert das 'Feld' die chkBox als String und nicht als HTML-Code wie hier zu sehen: (http://jsfiddle.net/97gqZ/30/). – Phillip