2010-08-17 2 views
6

Ciao io sono sicuro che ci deve essere un modo semplice per fare questo, ma non riesce a trovare la possibilità di impostare da nessuna parte.jQuery datepicker, selezione mese disabilitazione

Sto provando a disattivare i pulsanti sinistra/destra che consentono all'utente di modificare i mesi. Ho rimosso il calo lista di mesi giù, ma non può sbarazzarsi dei pulsanti.

$("#date").datepicker({ 
    changeMonth: false, 
    changeYear: false, 
    dateFormat: 'dd/mm/yy', 
    duration: 'fast' 
}); 

risposta

10

È possibile disattivare in modo efficace utilizzando stepMonths facendo andare da nessuna parte se cliccato, in questo modo:

$("#date").datepicker({ 
    changeMonth: false, 
    changeYear: false, 
    dateFormat: 'dd/mm/yy', 
    duration: 'fast', 
    stepMonths: 0 
}); 

You can give it a try here

In alternativa, è possibile rimuovere i pulsanti in questo modo:

$("#date").datepicker({ 
    changeMonth: false, 
    changeYear: false, 
    dateFormat: 'dd/mm/yy', 
    duration: 'fast' 
}).focus(function() { 
    $(".ui-datepicker-prev, .ui-datepicker-next").remove(); 
});​ 

You can give that a try here, t i suoi lavori perché l'opzione predefinita showOn è focus, se si sta utilizzando un evento diverso, legare semplicemente a quello dopo la chiamata .datepicker() (quindi l'evento viene eseguito per primo, non è possibile nascondere ciò che non è stato ancora creato).

+0

Grazie Nick, entrambi hanno fatto il trucco ma sono andati con la rimozione dei pulsanti alltog etere. – JBoom

0

Non so come farlo direttamente in jQuery (o se è possibile).

Ma se non riesci a trovare un modo per farlo, puoi sempre nascondere i pulsanti in css.

I selettori CSS che si desidera sono (a memoria quindi potrebbe essere necessario controllare)

.ui-datepicker .ui-datepicker-prev, 
.ui-datepicker .ui-datepicker-next 
{ 
    display:none; 
} 
2

La soluzione citata non ha funzionato per me, ho sviluppato questo:

$('#datepicker').find('.ui-datepicker-next').remove(); 
$('#datepicker').find('.ui-datepicker-prev').remove(); 
1

Questo è il mio modo di rendere selezionabile DatePicker solo l'anno:

if (document.styleSheets[0].addRule) { 
    document.styleSheets[0].addRule(".ui-datepicker-calendar", "display: none;"); 
else { 
    document.styleSheets[0].insertRule(".ui-datepicker-calendar {display: none;}", 0); 
} 

.datepicker({  
        dateFormat: 'yy', 
        showMonthAfterYear: false, 
        changeMonth: false, 
        changeYear: true, 
        showButtonPanel: true, 
        stepMonths: 12, 
        monthNames: ["", "", "", "", "", "", "", "", "", "", "", "", "", ""], 
        onChangeMonthYear: function (year) { 
         $(this).val(year); 
        } 
      });