new CalendarEightysix( 'display',{ 'injectInsideTarget':true, 'alwaysShow':true, 'theme':'default center green', 'pickFunction':function(date){ $('display-date').set('html','Wybrałeś: '+date.format('%A %d %B %Y')); $('hdn_date').set('value',date.format('%A %d %B %Y')); //updateHours(date.format('%A %d %B %Y')); var req = new Request.HTML({ method: 'post', url: "snippets/get_hours.php", data: 'day=' + date.format('%Y-%m-%d') + '&type=' + $('hdn_btype').get('value'), update: $('hours'), onRequest: function() { }, onSuccess: function(html){ scanHours(); $('hdn_date').set('value',date.format('%Y-%m-%d')); $('hdn_time').set('value',''); $('display-time').set('html',''); $('save').setStyle('visibility','hidden'); } }).send();
Cały kod index.php
<head>
<link rel="stylesheet" type="text/css" href="style.css" media="screen" />
<link rel="stylesheet" type="text/css" href="css/calendar-eightysix-v1.1-default.css" media="screen" />
<link rel="stylesheet" type="text/css" href="css/calendar-eightysix-v1.1-vista.css" media="screen" />
<link rel="stylesheet" type="text/css" href="css/calendar-eightysix-v1.1-osx-dashboard.css" media="screen" />
<script type="text/javascript" src="js/mootools-1.2.4-core.js"></script>
<script type="text/javascript" src="js/mootools-1.2.4.4-more.js"></script>
<script type="text/javascript" src="js/calendar-eightysix-v1.1.js"></script>
<script type="text/javascript">
/*
###############
# functions
###############
*/
function scanHours() {
if($('hours-list')) {
var li_a = $$('ul#hours-list li a');
li_a.each(function(ele, k){
ele.addEvent("click", function(e){
$('display-time').set('html','Wybrałeś: '+ele.get("id"));
$('hdn_time').set('value',ele.get("id"));
$('save').setStyle('visibility','visible');
});
});
}
}
function validate_email(field)
{
with (field)
{
apos=value.indexOf("@");
dotpos=value.lastIndexOf(".");
if (apos<1||dotpos-apos<2)
{return false;}
else {return true;}
}
}
function emailvalidate(email) {
var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
if(reg.test(email) == false) {
return false;
}
return true;
}
function isInteger(s)
{ var i;
for (i = 0; i < s.length; i++)
{
// Check that current character is number.
var c = s.charAt(i);
if (((c < "0") || (c > "9"))) return false;
}
// All characters are numbers.
return true;
}
/*
###############
# domready
###############
*/
window.addEvent('domready',function(){
MooTools.lang.set('pl-PL', 'Date', {
months: ['Styczeń', 'Luty', 'Marzec', 'Kwiecień', 'Maj', 'Czerwiec', 'Lipiec', 'Sierpień', 'Wrzesień', 'Październik', 'Listopad', 'Grudzień'],
days: ['Niedziela', 'Poniedziałek', 'Wtorek', 'Środa', 'Czwartek', 'Piątek', 'Sobota'],
dateOrder: ['data', 'miesiąc', 'rok', '/']
});
MooTools.lang.setLanguage('pl-PL');
if($('btype')) {
var binputs = $$('div#btype input');
binputs.each(function(ele, k){
ele.addEvent("click", function(e){
$('hours').set('html','');
$('hdn_time').set('value','');
$('display-time').set('html','');
$('display-date').set('html','');
$('save').setStyle('visibility','hidden');
$('hdn_btype').set('value',(k+1));
});
});
}
$('reserve').addEvent('submit', function(e) {
e.stop();
//validation
var error = 0;
var imie = $('imie').value.trim();
var email = $('email').value.trim();
var telefon = $('telefon').value.trim();
if(imie=='') {
$('imie_error').set('html','Wpisz poprawne imię i nazwisko!');
error = error + 1;
} else {
$('imie_error').set('html','');
}
if(email=='' || !emailvalidate(email)) {
$('email_error').set('html','Wpisz poprawny adres e-mail!');
error = error + 1;
}else {
$('email_error').set('html','');
}
if(telefon=='' || !isInteger(telefon) || telefon.length!=9) {
$('telefon_error').set('html','Wpisz numer telefonu (formaT: XXXXXXXXX)');
error = error + 1;
}else {
$('telefon_error').set('html','');
}
if(error==0) {
this.set('send', {
onRequest: function() {
//$('container2').addClass('ajax-loading');
},
onComplete: function(response) {
//$('log').set('html', response);
if(response=='true') {
$('container').set('html','<div id="confirm"><p class="confirm-p">Twoja rezerwacja przebiegła pomyślnie!<p></div>');
};
if(response=='false') {
alert('Niestety nie udało się zarezerwować wybranego terminu. Możliwe, że ktoś inny zarezerwował go w tym samym czasie. Spróbuj wybrać inną godzinę i zatwierdź formularz ponownie.');
};
}
});
this.send();
}
});
new CalendarEightysix(
'display',{
'injectInsideTarget':true,
'alwaysShow':true,
'theme':'default center green',
'pickFunction':function(date){
$('display-date').set('html','Wybrałeś: '+date.format('%A %d %B %Y'));
$('hdn_date').set('value',date.format('%A %d %B %Y'));
//updateHours(date.format('%A %d %B %Y'));
var req = new Request.HTML({
method: 'post',
url: "snippets/get_hours.php",
data: 'day=' + date.format('%Y-%m-%d') + '&type=' + $('hdn_btype').get('value'),
update: $('hours'),
onRequest: function() {
},
onSuccess: function(html){
scanHours();
$('hdn_date').set('value',date.format('%Y-%m-%d'));
$('hdn_time').set('value','');
$('display-time').set('html','');
$('save').setStyle('visibility','hidden');
}
}).send();
}
});
scanHours()
});
</script>
<title>System rezerwacji Orlik Reptowo</title>
</head>
<body>
<div id="main">
<ul id="menu">
<li class="active"><a href="index.php" id="rezerwacja">Rezerwacja</a></li>
<li ><a href="regulamin.php" id="regulamin">Regulamin</a></li>
</ul>
<div id="container">
<h2 id="r1">2. Wybierz datę</h2>
<h2 id="r1-5">1. Wybierz boisko</h2>
<h2 id="r2">3. Wybierz godzinę</h2>
<h2 id="r3">4. Podaj swoje dane</h2>
<h2 id="r4">5. Twoja rezerwacja</h2>
<div id="chosen">
<p id="display-date"></p>
<p id="display-time"></p>
</div>
<p id="alert" style="font-size:12px;">UWAGA!<br />Od 01 kwietnia (niedziela) Orlik będzie czynny: poniedziałek - czwartek: 16.00 - 21.00, piątek: 15.30 - 21.30, sobota i niedziela: 13.00 - 20.00, wtorek /24.04.2012 r./: 15.30-21.00, środa /25.04.2012 r./: 15.30 - 21.00 </p>
<div id="display" class="green"> </div>
<div id="btype">
<input type="radio" name="btype" value="1" checked="1" id="btype1">Boisko do piłki nożnej<br />
<input type="radio" name="btype" value="2" id="btype2">Boisko wielofunkcyjne
</div>
<div id="hours"></div>
<form method="post" class="formularz" name="reserve" id="reserve" action="snippets/form.php" style="">
<div class="field_name">Imię i nazwisko:</div><div class="field"><input name="imie" id="imie" value="" size="40" type="text"></div>
<div class="error" id="imie_error"></div>
<div class="field_name">Adres e-mail:</div><div class="field"><input name="email" id="email" value="" size="40" type="text"></div>
<div class="error" id="email_error"></div>
<div class="field_name">Telefon kontaktowy:</div><div class="field"><input name="telefon" id="telefon" value="" size="15" type="text"></div>
<div class="error" id="telefon_error"></div>
<div class="field_name_long">Uwagi:</div>
<div class="field_long"><textarea id="uwagi" cols="30" rows="6" name="uwagi"></textarea><div>
<input id="hdn_date" name="hdn_date" value="" type="">
<input id="hdn_time" name="hdn_time" value="" type="">
<input id="hdn_btype" name="hdn_btype" value="1" type="">
<input value="Rezerwuj!" name="save" id="save" type="submit">
</form>
</div>
</div>