[datepicker] Initialiser le 2e champ date en fonction du 1er

Arrête de faire n'importe quoi.

Sur un site bilingue, c'est soit l'UN, soit l'AUTRE !
Pas les 2 en même temps * !

* Et je ne suis pas sûr que ce soit faisable...

[EDIT] En fait, SI , c'est possible :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
$(function(){	// QUAND LE DOM EST PRET
 
  $.fn.datepicker.dates['en'] = {
    days: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
    daysShort: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
    daysMin: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"],
    months: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
    monthsShort: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
    today: "Today",
    clear: "Clear",
    format: "mm/dd/yyyy",
    titleFormat: "MM yyyy", /* Leverages same syntax as 'format' */
    weekStart: 0
  };
  $.fn.datepicker.dates['fr'] = {
    days: ["dimanche", "lundi", "mardi", "mercredi", "jeudi", "vendredi", "samedi"],
    daysShort: ["dim.", "lun.", "mar.", "mer.", "jeu.", "ven.", "sam."],
    daysMin: ["d", "l", "ma", "me", "j", "v", "s"],
    months: ["janvier", "février", "mars", "avril", "mai", "juin", "juillet", "août", "septembre", "octobre", "novembre", "décembre"],
    monthsShort: ["janv.", "févr.", "mars", "avril", "mai", "juin", "juil.", "août", "sept.", "oct.", "nov.", "déc."],
    today: "Aujourd'hui",
    clear: "Effacer",
    format: "dd/mm/yyyy",
    titleFormat: "MM yyyy", /* Leverages same syntax as 'format' */
    weekStart: 1
  };
 
});
$(function(){	// QUAND LE DOM EST PRET
 
	$('#datepickerd').datepicker({
		language: 'fr'
	});
	$('#datepickerf').datepicker({
		language: 'en'
	});
});

Super et de plus en voulant écrire que ça marchait toujours pas dans mon code, j'y ai trouvé un bug et maintenant ça marche :D

code bilingue qui marche au cas où :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/css/bootstrap-datepicker.css" rel="stylesheet">
</head>
<body>
 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/js/bootstrap-datepicker.min.js"></script>  
 
<form action="" method="POST">
<input type="radio" name="lgue" id="fr" value="fr">
<label for="fr">fr </label>
<br/>
<input type="radio" name="lgue" id="en" value="en">
<label for="en">en </label>
<input type="submit" name="choix" value="langue">
</form>    
 
 
<table>
	<tr>
<?php
if (isset($_POST['choix'])) {
        $lg=$_POST['lgue'];
        if ($lg=="fr") {?>
 
		<td>Date_de_début : </td>
        <td><input type="text" class="form-control datepicker" placeholder="selectionnez_une_date" id="datepickerd" name="datepickerd"></td>
 
		<td>Date_de_fin : </td>
        <td><input type="text" class="form-control datepicker" placeholder="selectionnez_une_date" id="datepickerf" name="datepickerf"></td>
	    <script src="datepicker_fr.js"></script> 
        <?php }
        else {?>
        <td>Date_of_beginning: </td>
        <td><input type="text" class="form-control datepicker" placeholder="selectionnez_une_date" id="datepickerd" name="datepickerd"></td>
 
		<td>Date_of_end: </td>
        <td><input type="text" class="form-control datepicker" placeholder="selectionnez_une_date" id="datepickerf" name="datepickerf"></td>
 
        <script src="datepicker_en.js"></script>       
        <?php }
} ?>        
	</tr>
</table>
 
 
</body>
 
</html>

datepicker_fr.js :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
$(function(){	// QUAND LE DOM EST PRET
	$.fn.datepicker.dates['fr'] = {
	days: ["dimanche", "lundi", "mardi", "mercredi", "jeudi", "vendredi", "samedi"],
	daysShort: ["dim.", "lun.", "mar.", "mer.", "jeu.", "ven.", "sam."],
	daysMin: ["d", "l", "ma", "me", "j", "v", "s"],
	months: ["janvier", "février", "mars", "avril", "mai", "juin", "juillet", "août", "septembre", "octobre", "novembre", "décembre"],
	monthsShort: ["janv.", "févr.", "mars", "avril", "mai", "juin", "juil.", "août", "sept.", "oct.", "nov.", "déc."],
	today: "Aujourd'hui",
	monthsTitle: "Mois",
	clear: "Effacer",
	weekStart: 1,
	format: "dd/mm/yyyy",
	titleFormat: "MM yyyy" /* Leverages same syntax as 'format' */
	};
 
	$('.datepicker').datepicker({
		language: 'fr',
		autoclose: true,
		todayHighlight: true
	});
});
// on affecte la date de début à la date de fin
$(function(){	// QUAND LE DOM EST PRET
  $('#datepickerd').datepicker({
  }).on('changeDate', function (selected) {
    var startDate = new Date(selected.date.valueOf());
    $('#datepickerf').datepicker('setDate', startDate);     // applique la même date
    $('#datepickerf').datepicker('setStartDate', startDate); // applique la même date de DEPART
  });
});

datepicker_en.js :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
$(function(){	// QUAND LE DOM EST PRET
	$.fn.datepicker.dates['en'] = {
	days: ["sunday", "monday", "tuesday", "wednesday", "thursday", "friday", "saturday"],
	daysShort: ["sun.", "mon.", "tue.", "wed.", "thu.", "fri.", "sat."],
	daysMin: ["su", "m", "tu", "w", "th", "f", "sa"],
	months: ["january", "february", "march", "april", "may", "june", "july", "august", "september", "october", "november", "december"],
	monthsShort: ["jan.", "feb.", "mar.", "apr.", "may", "june", "july", "aug.", "sept.", "oct.", "nov.", "dec."],
	today: "Today",
	monthsTitle: "Month",
	clear: "Clear",
	weekStart: 1,
	format: "dd/mm/yyyy",
	titleFormat: "MM yyyy", /* Leverages same syntax as 'format' */
	};
 
	$('.datepicker').datepicker({
		language: 'en',
		autoclose: true,
		todayHighlight: true
	});
});
 
// on affecte la date de début à la date de fin
$(function(){	// QUAND LE DOM EST PRET
	$('#datepickerd').datepicker({
	}).on('changeDate', function (selected) {
	  var startDate = new Date(selected.date.valueOf());
	  $('#datepickerf').datepicker('setDate', startDate);     // applique la même date
	  $('#datepickerf').datepicker('setStartDate', startDate); // applique la même date de DEPART
	});
  });