saisir une date avec Datepicker puis la convertir en ISO

**laurentSc** · 28/12/2012, 00h41

Bonsoir,

j'ai un formulaire qui permet de saisir une date puis souhaite la convertir en ISO afin de la stocker dans MYSQL et c'est là que ça ne va pas puisque la valeur retenue est sytématiquement la date d'origine du format UNIX :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
$(function() {
$("#datepicker").datepicker();
});
$(function() {
$.datepicker.setDefaults($.datepicker.regional[""]); 
$( "#datepicker" ).datepicker( $.datepicker.regional[ "fr" ] );
});

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<input name="date" id="datepicker" type="text">

puis

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
	public function setFrenchDate($date) {
		$dateintermediaire=explode("/",$date);
		$day=$dateintermediaire[0];
		$month=$dateintermediaire[1];
		$year=$dateintermediaire[2];
		$this->date=$year."/".$month."/".$day;//conversion fr->ISO (format bdd)
		return($this);
	}

qu'est-ce qui ne va pas ?

**danielhagnoul** · 28/12/2012, 13h53

Bonjour

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
<!DOCTYPE html>
<html lang="fr">
<head>
	<meta charset="utf-8">
	<meta name="Author" content="Daniel Hagnoul">
	<title>Forum jQuery</title>
	<link href='http://fonts.googleapis.com/css?family=Sofia|Ubuntu:400|Kreon'>
	<link rel="stylesheet" href="http://danielhagnoul.developpez.com/styles/dvjhRemBase.css">
	<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/overcast/jquery-ui.css">
	<style>
		/* TEST */
		#datepicker { width: 25rem; margin-right: 0.6rem; }
	</style>
</head>
<body>
	<h1>Forum jQuery</h1>
	<h2>Titre 2</h2>
	<section class="conteneur">
 
		<p>Date: <input type="text" id="datepicker" />
 
	</section>
	<footer itemscope itemtype="http://danielhagnoul.developpez.com/">
		<time datetime="2012-12-28T13:46:01.327+01:00" pubdate>2012-12-28T13:46:01.327+01:00</time>
		<span itemprop="name">Daniel Hagnoul</span>
		<a href="http://www.developpez.net/forums/u285162/danielhagnoul/" itemprop="url">@danielhagnoul</a>
		<a href="http://danielhagnoul.developpez.com/" itemprop="url">Mon cahier d’exercices</a>
		<a href="http://javascript.developpez.com/faq/jquery/" itemprop="url">FAQ</a>
		<a href="http://javascript.developpez.com/cours/?page=frameworks#jquery" itemprop="url">Tutoriels</a>
	</footer>
	<script src="http://danielhagnoul.developpez.com/lib/raphael-min.js"></script>
	<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
	<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/i18n/jquery-ui-i18n.min.js"></script>
	<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
	<script charset="utf-8" src="http://danielhagnoul.developpez.com/lib/dvjh/base.js"></script>
	<script>	
		"use strict";
 
		$(function(){
 
			$.datepicker.setDefaults( $.datepicker.regional[ "fr" ] );
 
			$( "#datepicker" ).datepicker({
				showOn : "button",
				buttonImage : "http://danielhagnoul.developpez.com/images/calendar.gif",
				buttonImageOnly : true,
		        showWeeks : true,
		        changeMonth : true,
		        changeYear : true,
		        showButtonPanel : true,
		        minDate : "-3m -15d", // la date du jour - 3 mois et 15 jours
		        maxDate : "+1y +3m +15d", // la date du jour + 1 an 3 mois et 15 jours
		        onClose : function( dateStr, ObjPicker ){
                	if ( dateStr.length > 0 ){
 
                		/*
                		 * Solution 1 : formatDate
                		 */
                		/*
                		$( this ).val( // this est l'input
                			$.datepicker.formatDate( "yy-mm-dd", 
                				new Date( 
		                			dateStr.slice( 6 ), // yyyy
		                			parseInt( dateStr.slice( 3, 5 ), 10 ) - 1, // mm - 1
		                			parseInt( dateStr.slice( 0, 2 ), 10 )  // dd
		                		) 
		                	)
		                );
		                */
 
		                /*
		                 * Solution 2 : toISOString
		                 * 
		                 * Je n'aime pas cette solution pour les
		                 * raisons indiquées ici : 
		                 * http://www.developpez.net/forums/d974898/webmasters-developpement-web/contribuez/date-iso-8601-mal-traitee-navigateurs/
		                 */
		                /*
                		$( this ).val( 
                			new Date( 
		                			dateStr.slice( 6 ), // yyyy
		                			parseInt( dateStr.slice( 3, 5 ), 10 ) - 1, // mm - 1
		                			parseInt( dateStr.slice( 0, 2 ), 10 )  // dd
		                	).toISOString()
		                );
		                */
 
 
		                /*
		                 * Solution 3 : formatISO
		                 */
                		$( this ).val( 
                			new Date( 
		                			dateStr.slice( 6 ), // yyyy
		                			parseInt( dateStr.slice( 3, 5 ), 10 ) - 1, // mm - 1
		                			parseInt( dateStr.slice( 0, 2 ), 10 )  // dd
		                	).formatISO()
		                );
 
		               /* 
		                * Le code de formatISO() :
		                *
							Date.prototype.formatISO = function(){
								this._toLen2 = function(_nowStr){
									_nowStr = _nowStr.toString();				
									return ('0'+_nowStr).substr(-2,2);
								};
								this._nowFormat = 'aaaa-mm-jjThh:ii:ss.lllSzz:00';
								this._nowFormat = this._nowFormat.replace(/j+/, this._toLen2(this.getDate()));
								this._nowFormat = this._nowFormat.replace(/m+/, this._toLen2(this.getMonth()+1));
								this._nowFormat = this._nowFormat.replace(/a+/, this.getFullYear());
								this._nowFormat = this._nowFormat.replace(/h+/, this._toLen2(this.getHours()));
								this._nowFormat = this._nowFormat.replace(/i+/, this._toLen2(this.getMinutes()));
								this._nowFormat = this._nowFormat.replace(/s+/, this._toLen2(this.getSeconds()));
								this._nowFormat = this._nowFormat.replace(/l+/, this.getMilliseconds());
								this._nowFormat = this._nowFormat.replace(/S+/, (this.getTimezoneOffset() < 0) ? ("+") : ("-"));
								this._nowFormat = this._nowFormat.replace(/z+/, this._toLen2(Math.abs(this.getTimezoneOffset()/60)));
								return this._nowFormat;
							};
						*/	               
                	}
		        }
			});
 
		});
 
		$(window).load(function(){
 
		});
	</script>
</body>  
</html>

**laurentSc** · 28/12/2012, 14h45

Merci beaucoup de me proposer une solution, mais je n'arrive pas à l'adapter à mon besoin : car autant, il faut la convertir en ISO pour MySQL, autant, il faut continuer à l'afficher en FR dans le champ (pour l'utilisateur) et c'est ça que je n'arrive pas à faire.

**Bovino** · 28/12/2012, 16h57

Ce n'est certainement pas JavaScript qui va te servir à stocker quoi que ce soit dans MySQL !

Donc puisque tu as une fonction PHP qui fait le travail (dans ton premier message), tu cherches à faire quoi au juste ?

**laurentSc** · 28/12/2012, 18h16

Ce n'est certainement pas JavaScript qui va te servir à stocker quoi que ce soit dans MySQL !

Et pourtant, si...J'utilise Datepicker pour que l'utilisateur sélectionne une date via un formulaire et celle-ci est stockée dans MySQL dans l'action du formulaire ; donc, quand l'utilisateur sélectionne sa date, celle-ci doit être affichée en FR dans le champ, mais ensuite, dans l'action, celle-ci doit être convertie en ISO avant stockage. Or avec mon code actuel, il arrive que la date soit nulle, et du coup, ça m'affiche 01/01/1970 et le debug est difficile car si j'enlève la bufférisation de la sortie, Datepicker ne marche plus, donc les echo ou les var_dump, impossible...

Invité · 28/12/2012, 18h49

Bonjour Laurent,
voici comment je procède :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
		<input id="idevent_Date1_en" name="event_Date1_en" type="hidden" />
		<input id="idevent_Date1" name="event_Date1" type="text" readonly="readonly" value="<?php echo $event_Date1; ?>" />

avec :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
	/* DATEPICKER : sélection de date */
		$("#idevent_Date1").datepicker({ 
		dateFormat: 'DD dd MM yy', firstDay:1, minDate: new Date(),	// de la forme : Vendredi 27 Janvier 2012 
		altFormat: 'yy-mm-dd', altField: '#idevent_Date1_en'		// (champ caché) format yy-mm-dd (anglais)
		});

En clair :
1/ l'affichage donne "en clair" (visible) la date en français ;
2/ altFormat: => type=""hidden" : le champ au format anglais (enregistrable "tel quel" dans la BdD au format DATE)
3/ A toi d'imposer une date "non nulle" (existance)

**laurentSc** · 28/12/2012, 19h16

Qu'est-ce que tu entends par "imposer une date "non nulle"", car pour l'instant $event_Date1 undefined variable...

Invité · 28/12/2012, 19h26

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

value="<?php echo $event_Date1; ?>" />

ou

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

value="" />

Ca dépend (si tu récupères une date existante, ou si tu fait le traitement sur la même page)...

**danielhagnoul** · 28/12/2012, 20h06

Envoyé par laurentSc

Merci beaucoup de me proposer une solution, mais je n'arrive pas à l'adapter à mon besoin : car autant, il faut la convertir en ISO pour MySQL, autant, il faut continuer à l'afficher en FR dans le champ (pour l'utilisateur) et c'est ça que je n'arrive pas à faire.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
<!DOCTYPE html>
<html lang="fr">
<head>
	<meta charset="utf-8">
	<meta name="Author" content="Daniel Hagnoul">
	<title>Forum jQuery</title>
	<link href='http://fonts.googleapis.com/css?family=Sofia|Ubuntu:400|Kreon'>
	<link rel="stylesheet" href="http://danielhagnoul.developpez.com/styles/dvjhRemBase.css">
	<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/overcast/jquery-ui.css">
	<style>
		/* TEST */
		#datepicker { width: 25rem; margin-right: 0.6rem; }
	</style>
</head>
<body>
	<h1>Forum jQuery</h1>
	<h2>Titre 2</h2>
	<section class="conteneur">
 
		<p>Date: <input type="text" id="datepicker" />
 
	</section>
	<footer itemscope itemtype="http://danielhagnoul.developpez.com/">
		<time datetime="2012-12-28T13:46:01.327+01:00" pubdate>2012-12-28T13:46:01.327+01:00</time>
		<span itemprop="name">Daniel Hagnoul</span>
		<a href="http://www.developpez.net/forums/u285162/danielhagnoul/" itemprop="url">@danielhagnoul</a>
		<a href="http://danielhagnoul.developpez.com/" itemprop="url">Mon cahier d’exercices</a>
		<a href="http://javascript.developpez.com/faq/jquery/" itemprop="url">FAQ</a>
		<a href="http://javascript.developpez.com/cours/?page=frameworks#jquery" itemprop="url">Tutoriels</a>
	</footer>
	<script src="http://danielhagnoul.developpez.com/lib/raphael-min.js"></script>
	<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
	<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/i18n/jquery-ui-i18n.min.js"></script>
	<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
	<script charset="utf-8" src="http://danielhagnoul.developpez.com/lib/dvjh/base.js"></script>
	<script>	
		"use strict";
 
		$(function(){
 
			$.datepicker.setDefaults( $.datepicker.regional[ "fr" ] );
 
			$( "#datepicker" ).datepicker({
				showOn : "button",
				buttonImage : "http://danielhagnoul.developpez.com/images/calendar.gif",
				buttonImageOnly : true,
		        showWeeks : true,
		        changeMonth : true,
		        changeYear : true,
		        showButtonPanel : true,
		        minDate : "-3m -15d", // la date du jour - 3 mois et 15 jours
		        maxDate : "+1y +3m +15d", // la date du jour + 1 an 3 mois et 15 jours
		        onClose : function( dateStr, ObjPicker ){
                	if ( dateStr.length > 0 ){
 
						/*
						 * Contiendra la date choisie au format ISO long.
						 * 
						 * A transmettre au serveur par une transaction AJAX
						 */
						var dateISOStr = new Date( 
							dateStr.slice( 6 ), // yyyy
							parseInt( dateStr.slice( 3, 5 ), 10 ) - 1, // mm - 1
							parseInt( dateStr.slice( 0, 2 ), 10 )  // dd
						).formatISO();
 
		               /* 
		                * Le code de formatISO() :
		                *
							Date.prototype.formatISO = function(){
								this._toLen2 = function(_nowStr){
									_nowStr = _nowStr.toString();				
									return ('0'+_nowStr).substr(-2,2);
								};
								this._nowFormat = 'aaaa-mm-jjThh:ii:ss.lllSzz:00';
								this._nowFormat = this._nowFormat.replace(/j+/, this._toLen2(this.getDate()));
								this._nowFormat = this._nowFormat.replace(/m+/, this._toLen2(this.getMonth()+1));
								this._nowFormat = this._nowFormat.replace(/a+/, this.getFullYear());
								this._nowFormat = this._nowFormat.replace(/h+/, this._toLen2(this.getHours()));
								this._nowFormat = this._nowFormat.replace(/i+/, this._toLen2(this.getMinutes()));
								this._nowFormat = this._nowFormat.replace(/s+/, this._toLen2(this.getSeconds()));
								this._nowFormat = this._nowFormat.replace(/l+/, this.getMilliseconds());
								this._nowFormat = this._nowFormat.replace(/S+/, (this.getTimezoneOffset() < 0) ? ("+") : ("-"));
								this._nowFormat = this._nowFormat.replace(/z+/, this._toLen2(Math.abs(this.getTimezoneOffset()/60)));
								return this._nowFormat;
							};
						*/	               
                	}
		        }
			});
 
		});
 
		$(window).load(function(){
 
		});
	</script>
</body>  
</html>

**laurentSc** · 28/12/2012, 21h08

Autant j'arrive à peu près à utiliser la solution de Daniel, autant je n'arrive pas avec celle de Jérôme (Quand je clique sur le champ, ça ne lance pas Datepicker). Mais quand même une question pour Daniel ; pour pouvoir utiliser la date saisie, j'ai placé le champ dans un formulaire :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<form name="formulaire" method="post" action="">
Date: <input id="datepicker" name="date" type="text">
...
</form>

et plus loin, j'ai mis ce code :

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<?php
if (isset($_POST['date'])) echo "date=".$_POST['date'];
?>

Mais je ne vois rien ; c'est normal ?
Sinon, mon idée pour transmettre la valeur en ISO au serveur, c'est de la mettre dans un champ hidden de ce formulaire. Mais autant dans le post de 13h53, tu proposais 3 solutions, autant là, tu dis de le faire avec Ajax ; je peux utiliser une des 3 solutions ?

**danielhagnoul** · 28/12/2012, 21h32

Envoyé par Bovino

Ce n'est certainement pas JavaScript qui va te servir à stocker quoi que ce soit dans MySQL !

Pour transmettre une information au serveur il faut une transaction AJAX !

**laurentSc** · 28/12/2012, 21h49

Mais pourtant, j'utilise souvent cette méthode des champs hidden et pour m'en assurer, j'ai fait le code suivant qui marche :

Code PHP :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta content="text/html; charset=ISO-8859-1"
 http-equiv="content-type">
  <title></title>
</head>
<body>
<form action="" method="post">
<input type="hidden" name="test" value="toto">
<INPUT TYPE="submit" NAME="nom" VALUE=" Envoyer ">
 
</form>
<?php if (isset($_POST['test'])) echo $_POST['test']; ?>
</body>
</html>

et sinon, tu n'as pas répondu à ma question :

Mais je ne vois rien ; c'est normal ?

**SpaceFrog** · 29/12/2012, 10h14

mets un id a ton hidden
a quel moment mets tu la date dans le hidden .

**laurentSc** · 29/12/2012, 11h29

J'ai légèrement modifié le script de Daniel afin d'afficher la valeur en ISO ; j'ai compris pourquoi avant, je ne voyais rien : il y avait un conflit dans le nommage du id ; pour le moment, j'ai "oublié" le hidden, mais je voudrais réussir à afficher la valeur en ISO et pour l'instant, elle ne s'affiche qu'en FR...Qu'est-ce qui va pas ? (je suis loin d'être un expert en js)

Code phtml :

Sélectionner tout - Visualiser dans une fenêtre à part

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
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
<!DOCTYPE html>
<html lang="fr">
<head>
	<meta charset="utf-8">
	<meta name="Author" content="Daniel Hagnoul">
	<title>Forum jQuery</title>
	<link href='http://fonts.googleapis.com/css?family=Sofia|Ubuntu:400|Kreon'>
	<link rel="stylesheet" href="http://danielhagnoul.developpez.com/styles/dvjhRemBase.css">
	<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/overcast/jquery-ui.css">
	<style>
		/* TEST */
		#datepicker { width: 25rem; margin-right: 0.6rem; }
	</style>
</head>
<body>
	<h1>Forum jQuery</h1>
	<h2>Titre 2</h2>
	<section class="conteneur">
 <form id="form"  method="post" action="?">
		Date: <input type="text" name="form_date" id="datepicker" value="" />
		<input value="Valider" type="submit"/>
</form>		
 
	</section>
 
 
	<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
	<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/i18n/jquery-ui-i18n.min.js"></script>
	<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
	<!--<script charset="utf-8" src="http://danielhagnoul.developpez.com/lib/dvjh/base.js"></script>-->
	<script>	
		"use strict";
 
		$(function(){
 
			$.datepicker.setDefaults( $.datepicker.regional[ "fr" ] );
 
			$( "#datepicker" ).datepicker({
				showOn : "button",
				buttonImage : "http://danielhagnoul.developpez.com/images/calendar.gif",
				buttonImageOnly : true,
		        showWeeks : true,
		        changeMonth : true,
		        changeYear : true,
		        showButtonPanel : true,
		        minDate : "-10y -3m -15d", // la date du jour - 3 mois et 15 jours et 10 ans
		        maxDate : "+1y +3m +15d", // la date du jour + 1 an 3 mois et 15 jours
		        onClose : function( dateStr, ObjPicker ){
                	if ( dateStr.length > 0 ){
 
                		/*
                		 * Solution 1 : formatDate
                		 */
                		/*
                		$( this ).val( // this est l'input
                			$.datepicker.formatDate( "yy-mm-dd", 
                				new Date( 
		                			dateStr.slice( 6 ), // yyyy
		                			parseInt( dateStr.slice( 3, 5 ), 10 ) - 1, // mm - 1
		                			parseInt( dateStr.slice( 0, 2 ), 10 )  // dd
		                		) 
		                	)
		                );
		                */
 
		                /*
		                 * Solution 2 : toISOString
		                 * 
		                 * Je n'aime pas cette solution pour les
		                 * raisons indiquées ici : 
		                 * http://www.developpez.net/forums/d974898/webmasters-developpement-web/contribuez/date-iso-8601-mal-traitee-navigateurs/
		                 */
		                /*
                		$( this ).val( 
                			new Date( 
		                			dateStr.slice( 6 ), // yyyy
		                			parseInt( dateStr.slice( 3, 5 ), 10 ) - 1, // mm - 1
		                			parseInt( dateStr.slice( 0, 2 ), 10 )  // dd
		                	).toISOString()
		                );
		                */
 
 
		                /*
		                 * Solution 3 : formatISO
		                 */
                		form.datepicker.value=$( this ).val( 
                			new Date( 
		                			dateStr.slice( 6 ), // yyyy
		                			parseInt( dateStr.slice( 3, 5 ), 10 ) - 1, // mm - 1
		                			parseInt( dateStr.slice( 0, 2 ), 10 )  // dd
		                	).formatISO()
		                );
 
		               /* 
		                * Le code de formatISO() :
		                *
							Date.prototype.formatISO = function(){
								this._toLen2 = function(_nowStr){
									_nowStr = _nowStr.toString();				
									return ('0'+_nowStr).substr(-2,2);
								};
								this._nowFormat = 'aaaa-mm-jjThh:ii:ss.lllSzz:00';
								this._nowFormat = this._nowFormat.replace(/j+/, this._toLen2(this.getDate()));
								this._nowFormat = this._nowFormat.replace(/m+/, this._toLen2(this.getMonth()+1));
								this._nowFormat = this._nowFormat.replace(/a+/, this.getFullYear());
								this._nowFormat = this._nowFormat.replace(/h+/, this._toLen2(this.getHours()));
								this._nowFormat = this._nowFormat.replace(/i+/, this._toLen2(this.getMinutes()));
								this._nowFormat = this._nowFormat.replace(/s+/, this._toLen2(this.getSeconds()));
								this._nowFormat = this._nowFormat.replace(/l+/, this.getMilliseconds());
								this._nowFormat = this._nowFormat.replace(/S+/, (this.getTimezoneOffset() < 0) ? ("+") : ("-"));
								this._nowFormat = this._nowFormat.replace(/z+/, this._toLen2(Math.abs(this.getTimezoneOffset()/60)));
								return this._nowFormat;
							};
						*/	               
                	}
		        }
			});
 
		});
 
		$(window).load(function(){
 
		});
	</script>       
	<?php if (isset($_POST['form_date'])) echo $_POST['form_date']; ?>
</body>  
</html>

Invité · 29/12/2012, 11h41

Pourquoi faire simple quand on peut faire compliqué...

Ceci fonctionne, tel que tu le souhaites :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

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
<!DOCTYPE html>
<html>
<head>
<title></title>
<!-- META -->
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<!-- Scripts jQuery : initialisation -->
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/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.9.2/jquery-ui.js"></script>
<script>
$(function() {
        /* DATEPICKER : sélection de date */
        $("#idDateFR").datepicker({ 
                dateFormat: 'DD dd MM yy',      // de la forme : Vendredi 27 Janvier 2012
                firstDay:1,
                altFormat: 'yy-mm-dd', altField: '#idDateISO'   // (champ caché) format yyyy-mm-dd (ISO)
        }); 
});
</script>
<script>
// Date en français
jQuery(function($){
   $.datepicker.regional['fr'] = {
      closeText: 'Fermer',
      prevText: '<Préc',
      nextText: 'Suiv>',
      currentText: 'Courant',
      monthNames: ['Janvier','Février','Mars','Avril','Mai','Juin',
      'Juillet','Août','Septembre','Octobre','Novembre','Décembre'],
      monthNamesShort: ['Jan','Fév','Mar','Avr','Mai','Jun',
      'Jul','Aoû','Sep','Oct','Nov','Déc'],
      dayNames: ['Dimanche','Lundi','Mardi','Mercredi','Jeudi','Vendredi','Samedi'],
      dayNamesShort: ['Dim','Lun','Mar','Mer','Jeu','Ven','Sam'],
      dayNamesMin: ['Di','Lu','Ma','Me','Je','Ve','Sa'],
      weekHeader: 'Sm',
      dateFormat: 'dd/mm/yy',
      firstDay: 1,
      isRTL: false,
      showMonthAfterYear: false,
      yearSuffix: ''};
   $.datepicker.setDefaults($.datepicker.regional['fr']);
});</script> 
</head>

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<body>
 
<?php
// Initialisation/Récupération des données du formulaire
$DateISO        = isset($_POST['DateISO'])?     $_POST['DateISO']       : '';
$DateFR         = isset($_POST['DateFR'])?      $_POST['DateFR']        : '';
?>
<form action="" method="post">
	<input type="hidden" id="idDateISO" name="DateISO" value="<?php echo $DateISO; ?>" />
	Date : <input type="text" id="idDateFR" name="DateFR" value="<?php echo $DateFR; ?>" style="width:200px;"/>
	<input type="submit" name="go" value="Envoyer" />
</form>
<?php if($DateISO!=''){ echo 'La date ISO est : '.$DateISO; } ?>
 
</body>
</html>

Les noms de variables sont suffisamment explicites, ou pas ?

Et si vous vous posez des questions : Datepicker Widget altField/altFormat

**laurentSc** · 29/12/2012, 14h09

Bon, je ne sais pas si ton code est plus simple que celui de Daniel (une fois enlevé le code commenté). J'ai trouvé comment rajouter la flèche "précédente" avec le lien que tu as fourni sur Datepicker, par contre, l'affichage n'est pas en utf-8, même en ayant rajouté header('Content-Type: text/html; charset=utf-8'); dans la partie PHP...
Au fait, les noms de variable, ça va

**SpaceFrog** · 29/12/2012, 17h28

Heu quel rapport entre charset=utf-8 et date ISO ????

**laurentSc** · 29/12/2012, 17h39

La conversion en ISO se passe bien mais le problème se situe dans la saisie de la date (en FR !) avec Datepicker : c'est dans l'affichage du calendrier qu'il y a un problème de non utf-8...