2015-11-24 18 views
5

Ho il codice per aggiungere un selettore di date. Funzionando bene. ma quando provo ad aggiungere più di un raccoglitore (div). Funziona solo il primo raccoglitore, Qualcuno può spiegarmi cosa c'è che non va. Devo aggiungere sedici datepicker (ingressi) nel mio orario.Datepicker multipli che non funzionano

<!DOCTYPE HTML> 
 
<html> 
 
    <head> 
 
    <link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css" rel="stylesheet"> 
 
    <link rel="stylesheet" type="text/css" media="screen" 
 
    href="http://tarruda.github.com/bootstrap-datetimepicker/assets/css/bootstrap-datetimepicker.min.css"> 
 
    </head> 
 
    <body> 
 
    <div id="datetimepicker" class="input-append date"> 
 
     <input type="text"></input> 
 
     <span class="add-on"> 
 
     <i data-time-icon="icon-time" data-date-icon="icon-calendar"></i> 
 
     </span> 
 
    </div> 
 

 

 
    <div id="datetimepicker" class="input-append date"> 
 
     <input type="text"></input> 
 
     <span class="add-on"> 
 
     <i data-time-icon="icon-time" data-date-icon="icon-calendar"></i> 
 
     </span> 
 
    </div> 
 
    <script type="text/javascript" 
 
    src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.3/jquery.min.js"> 
 
    </script> 
 
    <script type="text/javascript" 
 
    src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/js/bootstrap.min.js"> 
 
    </script> 
 
    <script type="text/javascript" 
 
    src="http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.min.js"> 
 
    </script> 
 
    <script type="text/javascript" 
 
    src="http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.pt-BR.js"> 
 
    </script> 
 
    <script type="text/javascript"> 
 
     $('#datetimepicker').datetimepicker({ 
 
     format: 'dd/MM/yyyy hh:mm', 
 
     language: 'en', 
 
     pick12HourFormat: true // enables the 12-hour format time picker 
 

 
     }); 
 
    </script> 
 

 
    </body> 
 
<html>

+0

si utilizza lo stesso id '# datetimepicker' – Raviteja

risposta

4

Sostituire id da class, perché id deve essere unico nel medesimo documento:

$('#datetimepicker').datetimepicker({ 

dovrebbe essere:

$('.date').datetimepicker({ 

Spero che questo aiuti.


<!DOCTYPE HTML> 
 
<html> 
 
    <head> 
 
    <link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css" rel="stylesheet"> 
 
    <link rel="stylesheet" type="text/css" media="screen" 
 
    href="http://tarruda.github.com/bootstrap-datetimepicker/assets/css/bootstrap-datetimepicker.min.css"> 
 
    </head> 
 
    <body> 
 
    <div id="datetimepicker" class="input-append date"> 
 
     <input type="text"></input> 
 
     <span class="add-on"> 
 
     <i data-time-icon="icon-time" data-date-icon="icon-calendar"></i> 
 
     </span> 
 
    </div> 
 

 

 
    <div id="datetimepicker" class="input-append date"> 
 
     <input type="text"></input> 
 
     <span class="add-on"> 
 
     <i data-time-icon="icon-time" data-date-icon="icon-calendar"></i> 
 
     </span> 
 
    </div> 
 
    <script type="text/javascript" 
 
    src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.3/jquery.min.js"> 
 
    </script> 
 
    <script type="text/javascript" 
 
    src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/js/bootstrap.min.js"> 
 
    </script> 
 
    <script type="text/javascript" 
 
    src="http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.min.js"> 
 
    </script> 
 
    <script type="text/javascript" 
 
    src="http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.pt-BR.js"> 
 
    </script> 
 
    <script type="text/javascript"> 
 
     $('.date').datetimepicker({ 
 
     format: 'dd/MM/yyyy hh:mm', 
 
     language: 'en', 
 
     pick12HourFormat: true // enables the 12-hour format time picker 
 

 
     }); 
 
    </script> 
 

 
    </body> 
 
<html>

+0

utilizzarlo. Ho persino perso il selettore dei tempi della data del primo input di lavoro –

+0

sì, ho capito che funziona con la classe anziché con l'id. Grazie –

Problemi correlati