JQuery DatePicker e beforeShowDay

Sto disperatamente cercando di utilizzare questa funzione per abilitare giorni solo specifici nel mio datepicker, ma la funzione beforeShowDay è mai innescato :(JQuery DatePicker e beforeShowDay

anche questo non funziona:

$(document).ready(function(){ 
/*initialisation des composants*/ 
initComponent(); 
}); 


availableDates = new Array(); 

/* Fonction d'initialisation des composants */ 
function initComponent(){ 

/* Date retrait */ 
$("#dateRetrait").datepicker(); 

$("#dateRetrait").datepicker({beforeShowDay: function(d) { 
     console.log("bsd"); 
     alert("bsd"); 
    }}); 

//$("#dateRetrait").datepicker({buttonImage: "../../../Images/boutons/btn_calendier.png"}); 
//$("#dateRetrait").datepicker({showButtonPanel: true }); 
//$("#dateRetrait").datepicker({beforeShow: function() {setTimeout(function() {$(".ui-datepicker").css("z-index", 9999999999);}, 10);}}); 

$('#comboLieux').attr('disabled', 'disabled'); 
$('#comboCreneau').attr('disabled', 'disabled'); 
$('#dateRetrait').attr('disabled', 'disabled'); 
$('#dateRetrait').datepicker('option', 'minDate', new Date()); 

$("#dateRetrait").datepicker("option","dateFormat", 'dd-mm-yy'); 
}

Se avete qualche idea, sarei molto grato

infatti, anche questo non funziona:

<html lang="en"> 
<head> 
<meta charset="utf-8" /> 
<title>jQuery UI Datepicker - Restrict date range</title> 
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" /> 
<script src="http://code.jquery.com/jquery-1.8.3.js"></script> 
<script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script> 
<link rel="stylesheet" href="/resources/demos/style.css" /> 
<script> 
$(function() { 
$("#datepicker").datepicker({ minDate: -20, maxDate: "+1M +10D" }); 
$("#datepicker").datepicker({beforeShowDay: function(d) { 
     console.log(d); 
     alert(d); 
    }}); 
}); 
</script> 
</head> 
<body> 
<p>Date: <input type="text" id="datepicker" /></p> 
</body> 
</html>

fonte

2013-01-23 user1826124

Si prega di fornire html – Dom

– user1826124

anche come si presenta il resto del tuo js, in particolare la sezione in cui si chiama function: 'initComponent()'? – Dom

Secondo jQueryUI's Datepicker API,

enter image description here

Questo spiega perché

$("#dateRetrait").datepicker({beforeShowDay: function(d) { 
     console.log("bsd"); 
     alert("bsd"); 
    }});

non funziona.

Inoltre, ho notato che chiami .datepicker() più volte e ogni volta che dai parametri diversi.

Invece di:

$("#dateRetrait").datepicker(); 

$("#dateRetrait").datepicker({beforeShowDay: function(d) { 
     console.log("bsd"); 
     alert("bsd"); 
    }}); 

$('#dateRetrait').datepicker('option', 'minDate', new Date()); 

$("#dateRetrait").datepicker("option","dateFormat", 'dd-mm-yy');

Prova a fare questo:

$("#dateRetrait").datepicker({ 
    dateFormat: 'dd-mm-yy', 
    minDate: new Date(), 
    beforeShowDay: function(d) { 
     var dmy = (d.getMonth()+1); 
     if(d.getMonth()<9) 
      dmy="0"+dmy; 
     dmy+= "-"; 

     if(d.getDate()<10) dmy+="0"; 
      dmy+=d.getDate() + "-" + d.getFullYear(); 

     console.log(dmy+' : '+($.inArray(dmy, availableDates))); 

     if ($.inArray(dmy, availableDates) != -1) { 
      return [true, "","Available"]; 
     } else{ 
      return [false,"","unAvailable"]; 
     } 
    } 
    });

ho anche fornito con una demo: http://jsfiddle.net/yTMwu/18/. Spero che questo ti aiuti!

fonte

2013-01-23 16:46:40 Dom

tu sei il mio Dio !!!! Non ho pensato le chiamate multiple potrebbero infastidire il componente ... Grazie mille !!! – user1826124

Haha nessun problema. Assicurati di chiamare '.datepicker()' una volta in futuro. felice codifica! – Dom

Questa interruzione se si dispone di più id che usano quel datepicker()? – Jeff

La data di passaggio alla funzione di richiamata è una data e ora a tutti gli effetti. Quindi, se vuoi che sia confrontato con una stringa di date breve, una di esse deve essere convertita. Questo frammento della porzione di attributo beforeShowDay di datepicker dimostra che è necessaria una conversione. Qui semplicemente disabilito una singola data sul calendario per dimostrare il punto.

   beforeShowDay: function(date) { 
       var dd = date.getDate(); 
       var mm = date.getMonth()+1; //January is 0! 
       var yyyy = date.getFullYear(); 
       var shortDate = mm+'/'+dd+'/'+yyyy; 
       var test = "12/30/2014"; 
       if (shortDate == test) { 
        return [false, "" ]; 
       } else { 
        return [true, "" ]; 
       } 
      }

fonte

2015-03-18 12:31:05

Dom ha dato una buona spiegazione. E vorrei aggiungere ulteriori accorciare il codice:

Se si dispone di serie di availableDates in formato: 0000-00-00 (AAAA-MM-GG)

$("#dateRetrait").datepicker({ 
    dateFormat: 'dd-mm-yy', 
    minDate: new Date(), 
    beforeShowDay: function(d) {   
     var year = d.getFullYear(), 
      month = ("0" + (d.getMonth() + 1)).slice(-2), 
      day = ("0" + (d.getDate())).slice(-2); 

     var formatted = year + '-' + month + '-' + day; 

     if ($.inArray(formatted, availableDates) != -1) { 
      return [true, "","Available"]; 
     } else{ 
      return [false,"","unAvailable"]; 
     } 
    } 
});

fonte

2017-10-11 12:15:19

Grazie per questo snippet di codice, che potrebbe fornire un aiuto limitato e immediato. Una spiegazione adeguata [migliorerebbe notevolmente] (// meta.stackexchange. it/q/114762) il suo long-te rm valore mostrando * perché * questa è una buona soluzione al problema e renderebbe più utile ai futuri lettori con altre domande simili. Per favore [modifica] la tua risposta per aggiungere qualche spiegazione, incluse le ipotesi che hai fatto. –

JQuery DatePicker e beforeShowDay

risposta

Problemi correlati