Rechercher : dans
Par :

[PHP] Calendrier à afficher.

Dernière réponse le 4 déc 2007 à 08:42:15 linux120, le 2 fév 2007 à 18:16:17 
 Signaler ce message aux modérateurs

Bonjour!

J'ai un champ dans un formulaire qui affichera la date choisi dans un calendrier.

j'aimerais avoir le code pour intégrer ce calendrier.
J'afficherais ce champ et au bout du champ j'afficherais ce calendrier en petit format, l'utilisateur cliquerais sur ce calendrier et il y aurais un autre fenètre qui apparaîtrais avec le calendrier, qui contiendrais par défaut le mois courant, l'utilisateur pourrais choisir le mois et/ou l'années à afficher, puis cliquerais sur le date choisi , la fenêtre disparaitrais et mon champ à l'écran aurais la valeur que l'utilisateur à choisi.
J'espère que je me suis bien faire comprendre.
Merci!

Configuration: Windows XP
Firefox 1.5.0.9

Meilleures réponses pour « [PHP] Calendrier à afficher. » dans :
[Webmaster] Afficher facilement le code php/xhtml de vos pages VoirSi vous voulez proposer a vos visiteurs de voir la source de vos fichiers (PHP ou HTML), il y a plusieurs solutions. En php Afficher le code php Afficher le code html En html Informations Voir aussi En php Afficher le code php La...
[PHP] Comment afficher l'adresse IP d'un visiteur ? VoirPour afficher l'adresse IP d'un visiteur sur votre site, insérez ce code dans la zone où vous voulez qu'elle s'affiche.
[PHP] Lister le contenu d'un répertoire VoirGrâce à PHP, il est possible d'afficher le contenu d'un répertoire et de ses sous-répertoires. Voici ci-dessous une fonction permettant de parcourir récursivement les répertoires et sous-répertoires et d'en afficher les fichiers : function...
PHP - Affichage de texte sur le navigateur VoirLe but de PHP est de permettre la création de pages web dynamiques, ainsi son but premier est de pouvoir envoyer des données au navigateur. Les trois fonctions standards PHP fournit 3 fonctions permettant d'envoyer du texte au navigateur. Ces...
PHP - Récupération de données VoirPHP rend très simple la récupération de données envoyées par l'intermédiaire de formulaires HTML. Création d'un formulaire Grâce à la balise FORM du langage HTML, il est très simple de créer des formulaires comprenant : des champs de saisie des...

1

shetanus, le 3 fév 2007 à 04:38:23
  • +1

Salut,

Tiens,
Le code n'est pas de moi. il faut ça dans le corp :

<script type="text/javascript">
// <!-- <![CDATA[

// Project: Dynamic Date Selector (DtTvB) - 2006-03-16
// Script featured on JavaScript Kit- http://www.javascriptkit.com
// Code begin...
// Set the initial date.
var ds_i_date = new Date();
ds_c_month = ds_i_date.getMonth() + 1;
ds_c_year = ds_i_date.getFullYear();

// Get Element By Id
function ds_getel(id) {
	return document.getElementById(id);
}

// Get the left and the top of the element.
function ds_getleft(el) {
	var tmp = el.offsetLeft;
	el = el.offsetParent
	while(el) {
		tmp += el.offsetLeft;
		el = el.offsetParent;
	}
	return tmp;
}
function ds_gettop(el) {
	var tmp = el.offsetTop;
	el = el.offsetParent
	while(el) {
		tmp += el.offsetTop;
		el = el.offsetParent;
	}
	return tmp;
}

// Output Element
var ds_oe = ds_getel('ds_calclass');
// Container
var ds_ce = ds_getel('ds_conclass');

// Output Buffering
var ds_ob = ''; 
function ds_ob_clean() {
	ds_ob = '';
}
function ds_ob_flush() {
	ds_oe.innerHTML = ds_ob;
	ds_ob_clean();
}
function ds_echo(t) {
	ds_ob += t;
}

var ds_element; // Text Element...

var ds_monthnames = [
'Janvier', 'Février', 'Mars', 'Avril', 'Mai', 'Juin',
'Juillet', 'Aout', 'Septembre', 'Octobre', 'Novembre', 'Décembre'
]; // You can translate it for your language.

var ds_daynames = [
'Dim', 'Lun', 'Mar', 'Me', 'Jeu', 'Ven', 'Sam'
]; // You can translate it for your language.

// Calendar template
function ds_template_main_above(t) {
	return '<table cellpadding="3" cellspacing="1" class="ds_tbl">'
	     + '<tr>'
		 + '<th style="cursor: pointer" onclick="ds_py();"><<</th>'
		 + '<th style="cursor: pointer" onclick="ds_pm();"><</th>'
		 + '<th style="cursor: pointer" onclick="ds_hi();" colspan="3">Fermer</th>'
		 + '<th style="cursor: pointer" onclick="ds_nm();">></th>'
		 + '<th style="cursor: pointer" onclick="ds_ny();">>></th>'
		 + '</tr>'
	     + '<tr>'
		 + '<td colspan="7" class="ds_head">' + t + '</td>'
		 + '</tr>'
		 + '<tr>';
}

function ds_template_day_row(t) {
	return '<th width="30px">' + t + '</th>';
	// Define width in CSS, XHTML 1.0 Strict doesn't have width property for it.
}

function ds_template_new_week() {
	return '</tr><tr>';
}

function ds_template_blank_cell(colspan) {
	return '<td colspan="' + colspan + '"></td>'
}

function ds_template_day(d, m, y) {
	return '<th class="ds_cell" onclick="ds_onclick(' + d + ',' + m + ',' + y + ')">' + d + '</th>';
	// Define width the day row.
}

function ds_template_main_below() {
	return '</tr>'
	     + '</table>';
}

// This one draws calendar...
function ds_draw_calendar(m, y) {
	// First clean the output buffer.
	ds_ob_clean();
	// Here we go, do the header
	ds_echo (ds_template_main_above(ds_monthnames[m - 1] + ' ' + y));
	for (i = 0; i < 7; i ++) {
		ds_echo (ds_template_day_row(ds_daynames[i]));
	}
	// Make a date object.
	var ds_dc_date = new Date();
	ds_dc_date.setMonth(m - 1);
	ds_dc_date.setFullYear(y);
	ds_dc_date.setDate(1);
	if (m == 1 || m == 3 || m == 5 || m == 7 || m == 8 || m == 10 || m == 12) {
		days = 31;
	} else if (m == 4 || m == 6 || m == 9 || m == 11) {
		days = 30;
	} else {
		days = (y % 4 == 0) ? 29 : 28;
	}
	var first_day = ds_dc_date.getDay();
	var first_loop = 1;
	// Start the first week
	ds_echo (ds_template_new_week());
	// If sunday is not the first day of the month, make a blank cell...
	if (first_day != 0) {
		ds_echo (ds_template_blank_cell(first_day));
	}
	var j = first_day;
	for (i = 0; i < days; i ++) {
		// Today is sunday, make a new week.
		// If this sunday is the first day of the month,
		// we've made a new row for you already.
		if (j == 0 && !first_loop) {
			// New week!!
			ds_echo (ds_template_new_week());
		}
		// Make a row of that day!
		ds_echo (ds_template_day(i + 1, m, y));
		// This is not first loop anymore...
		first_loop = 0;
		// What is the next day?
		j ++;
		j %= 7;
	}
	// Do the footer
	ds_echo (ds_template_main_below());
	// And let's display..
	ds_ob_flush();
	// Scroll it into view.
	ds_ce.scrollIntoView();
}

// A function to show the calendar.
// When user click on the date, it will set the content of t.
function ds_sh(t) {
	// Set the element to set...
	ds_element = t;
	// Make a new date, and set the current month and year.
	var ds_sh_date = new Date();
	ds_c_month = ds_sh_date.getMonth() + 1;
	ds_c_year = ds_sh_date.getFullYear();
	// Draw the calendar
	ds_draw_calendar(ds_c_month, ds_c_year);
	// To change the position properly, we must show it first.
	ds_ce.style.display = '';
	// Move the calendar container!
	the_left = ds_getleft(t);
	the_top = ds_gettop(t) + t.offsetHeight;
	ds_ce.style.left = the_left + 'px';
	ds_ce.style.top = the_top + 'px';
	// Scroll it into view.
	ds_ce.scrollIntoView();
}

// Hide the calendar.
function ds_hi() {
	ds_ce.style.display = 'none';
}

// Moves to the next month...
function ds_nm() {
	// Increase the current month.
	ds_c_month ++;
	// We have passed December, let's go to the next year.
	// Increase the current year, and set the current month to January.
	if (ds_c_month > 12) {
		ds_c_month = 1; 
		ds_c_year++;
	}
	// Redraw the calendar.
	ds_draw_calendar(ds_c_month, ds_c_year);
}

// Moves to the previous month...
function ds_pm() {
	ds_c_month = ds_c_month - 1; // Can't use dash-dash here, it will make the page invalid.
	// We have passed January, let's go back to the previous year.
	// Decrease the current year, and set the current month to December.
	if (ds_c_month < 1) {
		ds_c_month = 12; 
		ds_c_year = ds_c_year - 1; // Can't use dash-dash here, it will make the page invalid.
	}
	// Redraw the calendar.
	ds_draw_calendar(ds_c_month, ds_c_year);
}

// Moves to the next year...
function ds_ny() {
	// Increase the current year.
	ds_c_year++;
	// Redraw the calendar.
	ds_draw_calendar(ds_c_month, ds_c_year);
}

// Moves to the previous year...
function ds_py() {
	// Decrease the current year.
	ds_c_year = ds_c_year - 1; // Can't use dash-dash here, it will make the page invalid.
	// Redraw the calendar.
	ds_draw_calendar(ds_c_month, ds_c_year);
}

// Format the date to output.
function ds_format_date(d, m, y) {
	// 2 digits month.
	m2 = '00' + m;
	m2 = m2.substr(m2.length - 2);
	// 2 digits day.
	d2 = '00' + d;
	d2 = d2.substr(d2.length - 2);
	// YYYY-MM-DD
	return y + '-' + m2 + '-' + d2;
//	return d2 + '-' + m2 + '-' + y;
}

// When the user clicks the day.
function ds_onclick(d, m, y) {
	// Hide the calendar.
	ds_hi();
	// Set the value of it, if we can.
	if (typeof(ds_element.value) != 'undefined') {
		ds_element.value = ds_format_date(d, m, y);
	// Maybe we want to set the HTML in it.
	} else if (typeof(ds_element.innerHTML) != 'undefined') {
		ds_element.innerHTML = ds_format_date(d, m, y);
	// I don't know how should we display it, just alert it to user.
	} else {
		alert (ds_format_date(d, m, y));
	}
}

// And here is the end.

// ]]> -->
</script>


ça dans le header :
<style type="text/css">
<!--

body {
	font-family: Tahoma;
	margin-left: 0;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
}

.ds_box {
	background-color: #FFF;
	border: 0;
	position: absolute;
	z-index: 32767;
}

.ds_tbl {
	background-color: #FFF;
}

.ds_head {
	background-color: #333;
	color: #FFF;
	font-size: 12px;
	font-weight: bold;
	text-align: center;
	letter-spacing: 2px;
}

.ds_cell {
	background-color: #FFF;
	color: #000;
	font-size: 12px;
	padding: 5px;
	cursor: pointer;
}

.ds_cell:hover {
	background-color: #F3F3F3;
} /* This hover code won't work for IE */
-->
</style>


Et le bouton doit contenir :
<input onclick="ds_sh(this);" name="date" readonly="readonly" style="cursor: text" value="Cliquez ici ...">


C'est Cools ?

Répondre à shetanus

2

shetanus, le 3 fév 2007 à 04:50:20
  • +1

Puis tu dois ajouter ceci :

<table class="ds_box" cellpadding="0" cellspacing="0" id="ds_conclass" style="display: none;">
<tr><td id="ds_calclass">
</td></tr>
</table>


C'est le bouton.

Tu peut ensuite choisir l'affichage de la date en AAAA-MM-JJ ou JJ-MM-AAAA.

Voici un petit exemple :

http://shetanus.free.fr/

Répondre à shetanus

3

amss, le 3 déc 2007 à 22:43:22

Bonjour,

Je trouve super intéressant votre script mais impossible de le faire fonctionner.... quelle extension faut il donne au fichier ?
merci de votre réponse
Amss

Répondre à amss

4

shetanus, le 3 déc 2007 à 23:13:01

Bonsoir,

Je ne m'en souviens plus, c'est un peu vieux.

Je regarde et vous envoie la methode.

Shetanus

Répondre à shetanus

5

shetanus, le 4 déc 2007 à 01:20:59
  • +1

C'est bon J'ai réussit à m'en souvenir.

Voici un exemple de nouveau :

http://shetanus.free.fr/index.php?option=com_content&task=view&id=16&Itemid=5

Bonne réception,

Répondre à shetanus

6

 amss, le 4 déc 2007 à 08:42:15

Merci beaucoup, j'attends votre aide,

A bientôt
Amss

Répondre à amss
Collection CommentÇaMarche.net