Implémentation du datepicker UI

**Zebulon777** · 04/09/2014, 08h48

Bonjour tout le monde,

Je recherche un calendrier sympa permettant la saisie de date sous la forme JJ/MM/AAAA, et bien sur qui soit facilement intégrable dans des scripts existant.

J'ai bien trouvé celui-ci : http://www.developpez.net/forums/d82...drier-v3-beta/, mais je n'arrive pas à l'intégrer à mon code.

Le champs INPUT s'affiche bien, mais quand je clique dedans, rien ne se passe.
Pourtant le j'ai bien ajouter le "mCalandar.js" à la fin de mon fichier HTML, avec mes autres includes.

J'ai surement oublié de faire quelque chose, mais je ne vois pas quoi.

Code :

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

1
2
 
ObjDate.innerHTML = "<input type='text' class='mCalendar' value=''>";

A moins que vous ayez un autre calendrier plus facile à exploiter à proposer ? Ou en JQUERY ?

**SpaceFrog** · 04/09/2014, 08h52

Vu qu'a priori tu utilise jquery ...
Il existe plein de plugins de calendrier jquery
en particulier celui de jquery UI ...http://jqueryui.com/datepicker/

**Zebulon777** · 04/09/2014, 09h31

Ha ouais, il est pas mal.
Par contre, je n'arrive pas à trouver les ressources à ajouter ?

**SpaceFrog** · 04/09/2014, 09h32

Le lien vers le download builder
qi te permet de selectionner les composants dont tu as besoin
le calendrier se trouve dans les widgets date picker
http://jqueryui.com/download/

**Zebulon777** · 04/09/2014, 09h40

Super, merci.

**Zebulon777** · 04/09/2014, 09h46

Bon, je dois passer à côté de quelque chose, car je n'arrive çà l'intégré à mon code.
A la fin du HTML :

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
...
...
...
<script charset="utf-8" src="http://code.jquery.com/jquery.js"></script>
<script src="MesFonctions.js"></script> 
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
</body>
</html>

Et dans mon code :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
$(xml).find('TERRAINS').each(
   function() {  
       var WCode_Terrain = $(this).attr('code_terrain');
       var WNom_Terrain = $(this).attr('nom_terrain');
// Application de la classe pour le nom de l'aérodrome.	
       var ObjTerrain = document.getElementById("Cell_Terrain");
       ObjTerrain.className = "Effet3D1";
       Cell_Terrain.innerHTML = WNom_Terrain;
       var ObjDate = document.getElementById("Cell_Date");
       WDateJour = Date();
       $('#Cell_Date').append($("Date: <input type='text' id='datepicker'>"))
})

Où est-ce que je crotte ?

Oulala, pas cool, même l'exemple ne fonctionne pas chez moi :

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
 
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Datepicker - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
$(function() {
$( "#datepicker" ).datepicker();
});
</script>
</head>
<body>
<p>Date: <input type="text" id="datepicker"></p>
</body>
</html>

Implémentation du datepicker UI [UI]

jQuery

Vue hybride

Discussions similaires

Partager

Partager