[Datetimepicker]Richiamare funzione per più id uguali

[Maures]

Buongiorno a tutti,
in un form ho inserito due campi di ricerca per una data iniziale e una finale.
Sto usando bootstrap e in particolare il plugin datetimepicker per semplificare l'inserimento della data e dell'ora.
Inserendo questo codice:

	<script type="text/javascript">
		$(document).ready(function () {
			$('#datetimepicker6').datetimepicker();
			$('#datetimepicker7').datetimepicker();
		})
	</script>

nel tag head della pagina html funziona correttamente, ma solo per la prima coppia.
Recupero diversi dati da un database con una query, e ho provato diversi modi, ma senza successo.
Qui c'è il codice che l'echo di php mi stampa a ogni riga:

<td>
	<form action='cerca_per_data.php?id=$id' method='post' target='_blank'>
		<div class='input-group date' id='datetimepicker6' style='width:200px;'>
			<input type='text' class='form-control' name='datetimepicker6'/>
			<span class='input-group-addon'>
			<span class='glyphicon glyphicon-calendar'></span>
			</span>
	       </div>
    
		<div class='input-group date' id='datetimepicker7' style='width:200px;'>
			<input type='text' class='form-control' name='datetimepicker7' />
         		<span class='input-group-addon'>
			<span class='glyphicon glyphicon-calendar'></span>
			</span>
		</div>
	<button type='submit' class='btn btn-default' value='Submit'><i class='fa fa-search'></i></button>
	</form>	
</td>

Qualche consiglio?

 

[flameseeker]

Nel DOM ogni id corrisponde in maniera univoca ad un elemento, non possono esistere due id uguali.
Per ciò che devi ottenere, è più appropriato l'uso delle classi:

	<script type="text/javascript">
		$(document).ready(function () {
			$('.datepicker').datetimepicker();
		})
	</script>

<td>
	<form action='cerca_per_data.php?id=$id' method='post' target='_blank'>
		<div class='input-group date datepicker' style='width:200px;'>
			<input type='text' class='form-control' name='datetimepicker6'/>
			<span class='input-group-addon'>
			<span class='glyphicon glyphicon-calendar'></span>
			</span>
	       </div>
    
		<div class='input-group date datepicker' style='width:200px;'>
			<input type='text' class='form-control' name='datetimepicker7' />
         		<span class='input-group-addon'>
			<span class='glyphicon glyphicon-calendar'></span>
			</span>
		</div>
	<button type='submit' class='btn btn-default' value='Submit'><i class='fa fa-search'></i></button>
	</form>	
</td>

 

[Maures]

ricordavo di aver già tentato con l'uso della classe, ed effettivamente funziona.

il problema è che il browser si impalla e mi si apre la finestra del debug con questo errore:

Uno script in questa pagina potrebbe essere occupato o aver smesso di rispondere. È possibile fermarlo adesso, aprirlo nel debugger o lasciarlo continuare.

Script: .......jquery-2.0.3.min.js:5

 

[flameseeker]

In questo momento non ho l'opportunità di effettuare dei test, ma passando al vaglio la documentazione del metodo datepicker mi sembra di capire (correggimi se sbaglio) che vada applicato ad un elemento input. Forse è questo il motivo per cui lo script si comporta in maniera inaspettata.

Prova quindi a spostare la classe su quegli elementi:

<td>
	<form action='cerca_per_data.php?id=$id' method='post' target='_blank'>
		<div class='input-group date' style='width:200px;'>
			<input type='text' class='form-control datepicker' name='datetimepicker6'/>
			<span class='input-group-addon'>
			<span class='glyphicon glyphicon-calendar'></span>
			</span>
	       </div>
    
		<div class='input-group date' style='width:200px;'>
			<input type='text' class='form-control datepicker' name='datetimepicker7' />
         		<span class='input-group-addon'>
			<span class='glyphicon glyphicon-calendar'></span>
			</span>
		</div>
	<button type='submit' class='btn btn-default' value='Submit'><i class='fa fa-search'></i></button>
	</form>	
</td>

Se ancora dovessi riscontrare problemi di quel tipo, l'unico consiglio che posso provare a darti è di aggiornare eventualmente le librerie jquery e jqueryui (che, almeno jquery, so per certo essere alla versione 2.1.3 ormai).

 

[Maures]

non gli piace neanche così...

stavo pensando al fatto che un altro script di bootstrap, usato in un'altra colonna, possa dargli fastidio

<script>
		$(document).ready(function() {
			$('.selectpicker').selectpicker();
		});
	</script>

lo richiamo subito sopra a quello di datepicker