Prima di tutto ho una griglia di kendo. Ora sto in modo dinamico l'aggiunta di una casella di controllo per il DataSource come di seguito:Css - Lo stile personalizzato sulla casella di controllo non funziona
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
}
];
Questi i stili attuate sulla casella di controllo:
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;
}
ho scoperto che questi stili funzionano su altre caselle di controllo che ho aggiunto alle schede di un pannello , ma nella griglia non viene visualizzato nulla.
ho creato un jsfiddle con le scatole nere essendo la casella di controllo designato. Ho nascosto il display:none;
nel css per vedere dove sono tutte le caselle di testo. Se è in uso, nessuna casella di controllo personalizzata viene visualizzata nella griglia.
Qualche idea, perché?
è necessario rimuovere il valore del modello poiché viene inserito anziché la variabile chkBox. i.e 'Modello :" "' – anpsmn
Ho appena notato che ho sia il campo che il modello. Quando il template viene rimosso, il 'field' interpreta chkBox come una stringa e non come un codice html come visto qui: (http://jsfiddle.net/97gqZ/30/). – Phillip