2013-04-17 12 views
5

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é?

+0

è necessario rimuovere il valore del modello poiché viene inserito anziché la variabile chkBox. i.e 'Modello :" "' – anpsmn

+0

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

risposta

1

Ho trovato il problema.

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

dovrebbe essere:

template: "#= selected #" 

che è stato un semplice errore di mine.

Qui è un funzionamento example.

+0

adesso capisco ... ho cancellato la mia risposta. – schellmax

+0

Nessun problema. Grazie comunque. – Phillip

+0

Grazie per il campione funzionante! – callisto

Problemi correlati