fullcalendar le même evenement sur la même date.
ADN
Bonjour à tous
Je travaille actuellement sur un calendrier (fullcalendar).
J'ai un formulaire dans lequel j'ai:
-choix du vehicule
-choix de la date de début
-choix de la date de fin
->bouton reserver ->intégration dans la base de donnée ->affichage dans le calendrier.
J'ai mis en place un système de messages d'erreur. Si l'utilisateur n'a pas selectionner de vehicule ou si il n'a pas selectionner de date de fin etc...
J'aimerais y ajouter une verification: Si le véhicule est déjà enregistré sur les dates séléctionnée -> message erreur. C'est à dire par exemple que l'utilisateur ne peux pas enregistrer une réservation sur la renault mégane du 15 au 20 juin vu que dans la base de donnée ce véhicule est déjà reservé du 18 au 22juin par un autre utilisateur.
Mon formulaire:
<form>
<fieldset>
<div class="form-group">
<label class="col-md-12 control-label" for="select_cars">Choisissez votre vehicule:</label>
<div class="col-md-12">
<select class="form-control" id="select_cars" style="cursor: pointer;">
<option></option>
</select>
<div id="messageerreur1" style="color: red; display:none;" >Veuillez selectionner un véhicule.</div>
<br>
</div>
<label class="col-md-12 control-label" for="select_date">Début de la location:</label>
<div class="col-md-12">
<input type="text" name="daterange" class="daterange" id="date_range" style="background: #fff; cursor: pointer; padding: 5px 10px; border: 1px solid #ccc; width: 100%">
<div id="messageerreur2" style="color: red; display:none;" >Veuillez selectionner une date de début.</div>
<br>
</div>
<label class="col-md-12 control-label" for="select_date">Fin de la location:</label>
<div class="col-md-12" >
<input type="text" name="daterange" class="daterange" id="date_range2" style="background: #fff; cursor: pointer; padding: 5px 10px; border: 1px solid #ccc; width: 100%">
<div id="messageerreur3" style="color: red; display:none;" >Veuillez selectionner une date de fin.</div>
<div id="messageerreur4" style="color: red; display:none;" >Veuillez selectionner une date de fin supérieure à la date de début.</div>
<div id="messageerreur5" style="color: red; display:none;" >Veuillez selectionner une date valide.</div>
<br>
</div>
<div class="col-md-12 hidden" >
<input type="hidden" name="id_event" id="id_evt">
</div>
<div class="col-md-12 hidden" name="id_utilisateur" id="id_utili" >
<input type="hidden" Bienvenue <?php echo $_SESSION['memberID']; ?>>
</div>
<div class="col-md-12 hidden" >
<input type="hidden" name="id_user_event" id="id_user_event">
</div>
</div>
</fieldset>
<div class="form-actions">
<div class="row">
<div class="col-md-12">
<button class="btn btn-default" type="button" id="add-event" >
Valider
</button>
<button class="btn btn-default" type="button" id="supprimer" style="display:none; background:#FFDADA; float: left" >
Supprimer
</button>
<button class="btn btn-default" type="button" id="annulerid" style="display:none;" >
Annuler
</button>
<button class="btn btn-default" type="button" id="add-event-2" style="display:none;" >
Modifier
</button>
</div>
</div>
</div>
</form>Et mon script:
$('#add-event').click(function () {
var moment = $('#calendar').fullCalendar('getDate');
moment = moment.format('YYYY-MM-DD HH:mm');
var id_car = $("#select_cars").val();
var id_user = <?php echo $_SESSION['memberID']; ?>
alert(id_car);
alert (id_user);
alert(start);
alert(end);
alert(moment);
if(id_car && start && end && start<end && moment<start){
$.ajax({
url: 'process.php',
/* data: {id_car: id_car, start: start, end: end}, */
type: 'POST',
data: 'type=formul&id_car='+id_car+'&id_user='+id_user+'&start='+start+'&end='+end,
dataType: 'json',
// beforSend
// success
// error
success: function(response){
if(response.status != 'success')
revertFunc();
$('#calendar').fullCalendar( 'destroy' );
refresh_cal();
},
error: function(e){
revertFunc();
alert('Error processing your request: '+e.responseText);
}
});
$.smallBox({
title: "Réservation enregistrée",
content: "<i class='fa fa-clock-o'></i> <i>Votre réservation à bien été prise en compte</i>",
color: "#659265",
iconSmall: "fa fa-check fa-2x fadeInRight animated",
timeout: 4000
});
$('html,body').animate({
scrollTop: $("#calendar").offset().top},
'slow');
/* alert('OK'); */
}
else if (start && end && start<end){
$('#messageerreur1').show();
}
else if (id_car && end){
$('#messageerreur2').show();
}
else if (id_car && start){
$('#messageerreur3').show();
}
else if (id_car && start && end && start>end){
$('#messageerreur4').show();
}
else if (id_car){
$('#messageerreur2').show();
$('#messageerreur3').show();
}
else if (start){
$('#messageerreur1').show();
$('#messageerreur3').show();
}
else if (end){
$('#messageerreur1').show();
$('#messageerreur2').show();
}
else if (moment>start){
$('#messageerreur5').show();
}
else{
/* alert('Manque un ou des champs. Ou date incorrecte.'); */
$.smallBox({
title: "Erreur",
content: "<i class='fa fa-clock-o'></i> <i>Veuillez remplir correctement tous les champs</i>",
color: "#C46A69",
iconSmall: "fa fa-times fa-2x fadeInRight animated",
timeout: 4000
});
}
});
refresh_cal();Donc j'ai bien mon "Start" mon "End" et mon "id_car". Mais je ne sais pas comment faire ma vérification.
Merci pour votre aide :)