[Javascript] Modifica input date

[Daniele_Carrara]

Buongiorno a tutti,
ho bisogno di un consiglio per risolvere una scomoda situazione...
ho 2 calendari per la selezione della data all'interno del mio sito, creato con il tag input date

<input id='ret' type='date' value='".$data_min."' name='data_ritorno' min='".$data_min."' required>

il tag è inserito da una funzione in PHP che inserisce dinamicamente la data minima selezionabile (ecco perchè ci sono delle variabili all'interno del tag).
Il problema che sto riscontrando è: c'è la possibilità tramite javascript di creare una funzione che modifica il valore minimo di uno dei 2 calendari in base alla data selezionata nell'altro?
Spero di essere stato chiaro, grazie in anticipo.

 

[marlev]

Ciao, ti allego la funzione in jQuery supponendo che hai due campi cosi

echo "<input id='arr' type='date' value='" . $data_min . "' name='data_arrivo' min='" . $data_min . "' required>";
echo "<input id='ret' type='date' value='" . $data_min . "' name='data_ritorno' min='" . $data_min . "' required>";

Questo e' il codice da inserire

   <script>
            jQuery(document).ready(function () {
                function min_date_fix() {
                    if (jQuery("#ret").length) {
                        jQuery("#ret, #arr").on("input propertychange", function () {
                            var cur_val = jQuery(this).val();
                            jQuery("#ret, #arr").val(cur_val).attr("min", cur_val);
                        });
                    }
                }
                min_date_fix();
            });
        </script>

Se non hai la libreria jQuery nella tua pagina, puoi includere in questo modo. Ma controlla prima...

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

 

[Daniele_Carrara]

Ciao Marlev, grazie per la risposta, ma alla fine sono riuscito a risolverla con una semplice funzione Javascript tramite evento onchange.
Grazie comunque!

 

[marlev]

Posta qui la tua soluzione )

 

[Daniele_Carrara]

<script  type="text/javascript">
function update(){
            document.getElementById("rit").min = document.getElementById("part").value; 
            document.getElementById("rit").value = document.getElementById("part").value; 
        }
</script>

<label>Departing date</label></br><input type='date' id='part' value="<?php echo $data_min ?>" name='data_partenza' min="<?php echo $data_min ?>" onchange="update();" required></td>
<?php  echo "<td width='50%''><div id='ret'><label>Returning date </label></br><input id='rit' type='date' value='".$data_min."' name='data_ritorno' min='".$data_min."' required></div></td>";

In questo modo ogni volta che si seleziona una data nel primo calendario la data minima del secondo viene settata pari a quella selezionata nel primo.
Alla fine la soluzione è stata piuttosto semplice, il problema principale è stato il fatto che il campo date sembra avviare le funzioni js solo tramite onchange

 

[marlev]

In effetti si lancia quando e' nel focus... Prova con setinterval e richiama la tua funzione da li, espandendola un po' oppure edita js di calendario in maniera tale che lancia la tua funzione update() dopo il cambio