Mostrar Mensajes
Tengo el calendario y un formulario que hice yo, que añade los datos en la DB. El calendario no me muestra los datos guardados en la DB, es decir me lo muestra pero sin los datos, y tendría que guardarlo en la fecha correspondiente (que yo la añada) pero lo guarda en la fecha actual, y si añado más de una, también. No entiendo que pasa.
Yo pensé que era por este código:
// si el día del evento coincide lo marcamos y guardamos la información
Código:
if($event_day == $day)
{
$marked = true;
$events_list = $event;
break;
}
Que hay una variable
Código:
$day
Código:
$day= $start_date->format('j');
Código:
$day=$start_date->$_POST['materiabox'];
Código:
Código:
<!-- Codigo javascript -->
<script>
$(function dias_seleccionados() {
var events = ['15-1-2011', '02-1-2011', '17-1-2011', '17-2-2011'];
$( "#datepicker" ).datepicker({
beforeShowDay: function(date) {
var current = $.datepicker.formatDate('dd-m-yy', date);
return jQuery.inArray(current, events) == -1 ? [true, ''] : [true, 'ui-state-hover', 'ui-state-highlight'];
}
});
});
</script>
<script type='text/javascript'>
document.getElementById('tipoEventos').addEventListener('change', function(){
var valor = this.value;
// Si el valor elegido del select == otro, habilitar la caja de texto.
if(valor === 'otro'){
var cajaTexto = document.getElementById('otroTipoEventos');
cajaTexto.disabled = false;
cajaTexto.style.display = 'none';
}
});
</script>
<style>
.btnmás {
background-color:transparent;
border: transparent;
font-size: 30px;
cursor: pointer;
border-radius: 1000px;
font-family: segoe script;
}
</style>
<style>
.textbox {
background: transparent;
font-family: segoe script;
border: none;
}
</style>
<style>
.btn1 {
background: #e09410;
background-image: -webkit-linear-gradient(top, #e09410, #ffb700);
background-image: -moz-linear-gradient(top, #e09410, #ffb700);
background-image: -ms-linear-gradient(top, #e09410, #ffb700);
background-image: -o-linear-gradient(top, #e09410, #ffb700);
background-image: linear-gradient(to bottom, #e09410, #ffb700);
-webkit-border-radius: 60;
-moz-border-radius: 60;
border-radius: 10px;
border: none;
font-size:15px;
font-family: segoe script;
padding: 1px 20px 2px 5px;
text-decoration: none;
width: 1px;
height: 30px;
cursor: pointer;
}
.btn1:hover {
background: #ffcc00;
text-decoration: none;
}
</style>
<style>
.btn2 {
background: #e09410;
background-image: -webkit-linear-gradient(top, #e09410, #ffb700);
background-image: -moz-linear-gradient(top, #e09410, #ffb700);
background-image: -ms-linear-gradient(top, #e09410, #ffb700);
background-image: -o-linear-gradient(top, #e09410, #ffb700);
background-image: linear-gradient(to bottom, #e09410, #ffb700);
-webkit-border-radius: 60;
-moz-border-radius: 60;
border-radius: 10px;
border: none;
font-size:15px;
font-family: segoe script;
padding: 1px 120px 2px 5px;
text-decoration: none;
width: 1px;
height: 30px;
cursor: pointer;
}
.btn2:hover {
background: #ffcc00;
text-decoration: none;
}
</style>
<style>
.btn3 {
background: #e09410;
background-image: -webkit-linear-gradient(top, #e09410, #ffb700);
background-image: -moz-linear-gradient(top, #e09410, #ffb700);
background-image: -ms-linear-gradient(top, #e09410, #ffb700);
background-image: -o-linear-gradient(top, #e09410, #ffb700);
background-image: linear-gradient(to bottom, #e09410, #ffb700);
-webkit-border-radius: 60;
-moz-border-radius: 60;
border-radius: 10px;
border: none;
font-size:15px;
font-family: segoe script;
padding: 1px 170px 2px 5px;
text-decoration: none;
width: 1px;
height: 30px;
cursor: pointer;
}
.btn3:hover {
background: #ffcc00;
text-decoration: none;
}
</style>
<style>
.btn4 {
background: #e09410;
background-image: -webkit-linear-gradient(top, #e09410, #ffb700);
background-image: -moz-linear-gradient(top, #e09410, #ffb700);
background-image: -ms-linear-gradient(top, #e09410, #ffb700);
background-image: -o-linear-gradient(top, #e09410, #ffb700);
background-image: linear-gradient(to bottom, #e09410, #ffb700);
-webkit-border-radius: 60;
-moz-border-radius: 60;
border-radius: 10px;
border: none;
font-size:15px;
font-family: segoe script;
padding: 1px 120px 2px 5px;
text-decoration: none;
width: 1px;
height: 30px;
cursor: pointer;
}
.btn4:hover {
background: #ffcc00;
text-decoration: none;
}
</style>
<style type='text/css'>
#tipoEventos {
border: inset;
border-color: orange;
opacity: 0.8;
font-family: sgoe script;
font-size: 14px;
}
#tipoEventos option {
font-family: sgoe script;
color: #333;
font-size: 1.5em;
}
#otroTipoEventos {
display: none;
border: inset;
border-color: orange;
opacity: 0.8;
font-family:segoe script;
font-size: 14px;
position: center;
}
</style>
<?php
// Establecer el idioma al Español para strftime().
setlocale( LC_TIME, 'spanish' );
// Si no se ha seleccionado mes, ponemos el actual y el año
$month = isset( $_GET[ 'month' ] ) ? $_GET[ 'month' ] : date( "Y-n" );
$week = 1;
for ( $i=1;$i<=date( 't', strtotime( $month ) );$i++ ) {
$day_week = date( 'N', strtotime( $month.'-'.$i ) );
$calendar[ $week ][ $day_week ] = $i;
if ( $day_week == 7 )
$week++;
}
?>
<!DOCTYPE html>
<html>
<head>
<title>Calendario PHP/HTML5</title>
<script src='https://www.google.com/recaptcha/api.js'></script>
<style type="text/css">body{margin:0;font-family:Lato;}ul,li{list-style-type:none; margin:0;padding:0;}.calendar{padding:30px;}.calendar .day{background:#ecf0f1;border-bottom:2px solid #bdc3c7;float:left;margin:3px;position:relative;height:120px;width:120px;}.day.marked{background:#3498db;border-color:#2980b9;}.day .day-number{color:#7f8c8d;left:5px;position:absolute;top:5px;}.day.marked .day-number{color:white;}.day .events{color:white;margin:29px 7px 7px;height:78px;overflow-x:hidden;overflow-y:hidden;}.day .events h5{margin:0 0 5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%;}.day .events strong,.day .events span{display:block;font-size:11px;}.day .events ul{}.day .events li{}
</style>
</head>
<body style="background-image: url('imagenes/fondo ies calvia proyecto.jpg'); background-repeat: no-repeat; background-position: all; background-attachment: fixed; background-size: cover;">
<div class="calendar">
<?php
$mysqli = new mysqli('censurado', 'censurado', 'censurado', 'censurado');
if ( $mysqli->connect_errno )
{
die( $mysqli->mysqli_connect_error() );
}
$result = $mysqli->query('SELECT fecha, tipoevento, otro, materia, asunto, tarea, evento FROM 1esoacalendar');
if( !$result )
die( $mysqli->error );
$events = array();
while($rows = $result->fetch_assoc())
{
$start_date = new DateTime($rows['fecha_inicio']);
$end_date = new DateTime($rows['fecha_fin']);
$day = $start_date->format('j');
$events[$day][] = array(
'start_hour' => $start_date->format('G:i a'),
'end_hour' => $end_date->format('G:i a'),
'team_code' => $rows['cod_equipo'],
'description' => $rows['descripcion'],
'tipoevento' => $rows['tipoEventos'],
'otro' => $rows['otroTipoEventos'],
'materia' => $rows['materiabox'],
'asunto' => $rows['asuntobox'],
'tarea' => $rows['tareabox'],
'evento' => $rows['eventobox'],
);
}
$datetime = new DateTime();
// mes en texto
$txt_months = array(
'Enero', 'Febrero', 'Marzo',
'Abril', 'Mayo', 'Junio',
'Julio', 'Agosto', 'septiembre',
'Octubre', 'Noviembre', 'Diciembre'
);
$month_txt = $txt_months[$datetime->format('n')-1];
// ultimo dia del mes
$month_days = date('j', strtotime("last day of"));
echo '<h1>' . $month_txt . '</h1>';
foreach(range(1, $month_days) as $day)
{
$marked = false;
$events_list = array();
foreach($events as $event_day => $event)
{
// si el dia del evento coincide lo marcamos y guardamos la informacion
if($event_day == $day)
{
$marked = true;
$events_list = $event;
break;
}
}
echo '
<div class="day' . ($marked ? ' marked' : '') . '">
<strong class="day-number">' . $day . '</strong>
<div class="events"><ul>';
foreach($events_list as $event)
{
echo '<li>
<div>
<strong>Tipo de evento:</strong>
<span>' . $event['tipoevento'] . '</span>
</div>
<div>
<strong>Otro:</strong>
<font>' . $event['otro'] . '</font>
</div>
<div>
<strong>Materia:</strong>
<font>' . $event['materia'] . '</font>
</div>
<div>
<strong>Asunto:</strong>
<font>' . $event['asunto'] . '</font>
</div>
<div>
<strong>Tarea:</strong>
<font>' . $event['tarea'] . '</font>
</div>
<div>
<strong>Evento:</strong>
<font>' . $event['evento'] . '</font>
</div>
</li>';
}
echo '</ul></div>
</div>';
}
?>
</div>
<form id="demo" align="center" action="añadirevento.php" method="post">
<font face="segoe script" size="+6" color="#333333">Insertar eventos</font>
<br>
<font face="segoe script" size="+1" color="#333333">Data:</font> <input type="date" name="databox" style="border: inset;border-color: orange; opacity: 0.8; font-family: segoe script; font-size:14px;" required>
<br>
<font face="segoe script" size="+1" color="#333333">Tipo de evento:</font>
<select name="tipoEventos" id="tipoEventos" style="border: inset;border-color: orange; opacity: 0.8; font-family: segoe script; font-size: 14px;" required>
<option value="null" selected disabled><font face="segoe script" size="+1">---Eligir tipo de evento---</font></option>
<option value="deberes"><font face="segoe script" size="+1">Deberes</font></option>
<option value="trabajos"><font face="segoe script" size="+1">Trabajos</font></option>
<option value="controles"><font face="segoe script" size="+1">Controles</font></option>
<option value="salidas"><font face="segoe script" size="+1">Salidas</font></option>
<option value="vacaciones"><font face="segoe script" size="+1">Vacaciones</font></option>
<option value="otro"><font face="segoe script" size="+1">Otro...</font></option>
</select>
<script type='text/javascript'>
document.getElementById('tipoEventos').addEventListener('change', function(){
var valor = this.value;
// Si el valor elegido del select == otro, habilitar la caja de texto.
if(valor === 'otro'){
var cajaTexto = document.getElementById('otroTipoEventos');
cajaTexto.disabled = false;
cajaTexto.style.display = 'inherit';
var display = document.getElementById('cambiartexto');
display.innerHTML='Asunto:';
var none = document.getElementById('cambiartextarea');
none.innerHTML='Evento:';
}
});
</script>
<script type='text/javascript'>
document.getElementById('tipoEventos').addEventListener('change', function(){
var valor = this.value;
if(valor === 'vacaciones'){
var display = document.getElementById('cambiartexto');
display.innerHTML='Asunto:';
var none = document.getElementById('cambiartextarea');
none.innerHTML='Evento:';
}
if (valor == 'salidas') {
var display = document.getElementById('cambiartexto');
display.innerHTML='Asunto:';
var none = document.getElementById('cambiartextarea');
none.innerHTML='Evento:';
}
if (valor == 'deberes') {
var display = document.getElementById('cambiartexto');
display.innerHTML='Materia:';
var none = document.getElementById('cambiartextarea');
none.innerHTML='Tarea:';
}
if (valor == 'trabajos') {
var display = document.getElementById('cambiartexto');
display.innerHTML='Materia:';
var none = document.getElementById('cambiartextarea');
none.innerHTML='Tarea:';
}
if (valor == 'controles') {
var display = document.getElementById('cambiartexto');
display.innerHTML='Materia:';
var none = document.getElementById('cambiartextarea');
none.innerHTML='Tarea:';
}
});
</script>
<script>
document.getElementById('tipoEventos').addEventListener('change', function(){
var valor= this.value;
if (valor=='deberes') {
var cajaTexto = document.getElementById('otroTipoEventos');
cajaTexto.disabled = false;
cajaTexto.style.display = 'none';
}
if (valor=='trabajos') {
var cajaTexto = document.getElementById('otroTipoEventos');
cajaTexto.disabled = false;
cajaTexto.style.display = 'none';
}
if (valor=='controles') {
var cajaTexto = document.getElementById('otroTipoEventos');
cajaTexto.disabled = false;
cajaTexto.style.display = 'none';
}
if (valor=='salidas') {
var cajaTexto = document.getElementById('otroTipoEventos');
cajaTexto.disabled = false;
cajaTexto.style.display = 'none';
}
if (valor=='vacaciones') {
var cajaTexto = document.getElementById('otroTipoEventos');
cajaTexto.disabled = false;
cajaTexto.style.display = 'none';
}
});
</script>
<script>
document.getElementById('tipoEventos').addEventListener('change', function(){
var valor = this.value;
if(valor === 'otro'){
var cambiarmateriabox1 = document.getElementById("materia");
cambiarmateriabox1.setAttribute("name","asuntobox");
var cambiartareabox1 = document.getElementById("tarea");
cambiartareabox1.setAttribute("name","eventobox");
}
});
</script>
<script>
document.getElementById('tipoEventos').addEventListener('change', function(){
var valor = this.value;
if(valor === 'vacaciones'){
var cambiarmateriabox2 = document.getElementById("materia");
cambiarmateriabox2.setAttribute("name","asuntobox");
var cambiartareabox2 = document.getElementById("tarea");
cambiartareabox2.setAttribute("name","eventobox");
}
if (valor == 'salidas') {
var cambiarmateriabox3 = document.getElementById("materia");
cambiarmateriabox3.setAttribute("name","asuntobox");
var cambiartareabox3 = document.getElementById("tarea");
cambiartareabox3.setAttribute("name","eventobox");
}
if (valor == 'deberes') {
var cambiarmateriabox4 = document.getElementById("materia");
cambiarmateriabox4.setAttribute("name","materiabox");
var cambiartareabox4 = document.getElementById("tarea");
cambiartareabox4.setAttribute("name","tareabox");
}
if (valor == 'trabajos') {
var cambiarmateriabox5 = document.getElementById("materia");
cambiarmateriabox5.setAttribute("name","materiabox");
var cambiartareabox5 = document.getElementById("tarea");
cambiartareabox5.setAttribute("name","tareabox");
}
if (valor == 'controles') {
var cambiarmateriabox6 = document.getElementById("materia");
cambiarmateriabox6.setAttribute("name","materiabox");
var cambiartareabox6 = document.getElementById("tarea");
cambiartareabox6.setAttribute("name","tareabox");
}
});
</script>
<input type="text" name="otroTipoEventos" id="otroTipoEventos" style="position:relative; left:880px; top: -30px; display: none;" disabled>
<br>
<font face="segoe script" size="+1" color="#333333" id="cambiartexto">Materia:</font>
<br>
<input type="text" name="materiabox" style="border:inset; border-color: orange; opacity: 0.8; font-family: segoe script; font-size: 14px;" oncut="return false" onpaste="return false" oncut="return false" placeholder=" Escribe aquí..." required id="materia">
<br>
<font face="segoe script" size="+1" color="#333333" id="cambiartextarea">Tarea:</font>
<br>
<textarea name="tareabox" style="border:inset; border-color: orange; opacity: 0.8; font-family: segoe script; font-size:14px;" cols="50" rows="10" placeholder="Escribe aquí..." required id="tarea"></textarea>
<br>
<center>
<div class="g-recaptcha" data-sitekey="6Lc87RwUAAAAAJNPN8mZSXyelFGykTxpJ3rx3WQ9"></div>
</center>
<br>
<input type="submit" name="Enviar" value="Guardar datos" class="btn2"> <input type="reset" name="eliminar" class="btn3" value="Limpiar formulario">
</form>
</body>
</html>
Yo no sé si es eso, pero no se cual es el error.
Me sale así:
https://drive.google.com/file/d/0B6mh5xJztGS9NUtPdDF2NllReTg/view?usp=sharing
Base de datos:
https://drive.google.com/open?id=0B6mh5xJztGS9UUlkeUcycGVOUUk
Gracias
