config.php
Código :
<?php
// Datos de conexion a la base de datos
$servidor='miservidor';
$usuario='miusuario';
$pass='mipass';
$bd='n260m_19293384_insti';
// Nos conectamos a la base de datos
$conexion = new mysqli($servidor, $usuario, $pass, $bd);
// verificamos si hubo algun error y lo mostramos
if ($conexion->connect_errno) {
echo "Error al conectar la base de datos {$conexion->connect_errno}";
}
// Url donde estara el proyecto, debe terminar con un "/" al final
$base_url="http://ies-calvia.260mb.net/calendario/Calendario-Bootstrap-php-mysql-master/";
?>
.gitattributes
Código :
# Auto detect text files and perform LF normalization * text=auto # Custom for Visual Studio *.cs diff=csharp # Standard to msysgit *.doc diff=astextplain *.DOC diff=astextplain *.docx diff=astextplain *.DOCX diff=astextplain *.dot diff=astextplain *.DOT diff=astextplain *.pdf diff=astextplain *.PDF diff=astextplain *.rtf diff=astextplain *.RTF diff=astextplain
descripcion_evento.php
Código :
<?php
//incluimos nuestro archivo config
include 'config.php';
// Incluimos nuestro archivo de funciones
include 'funciones.php';
// Obtenemos el id del evento
$id = evaluar($_GET['id']);
// y lo buscamos en la base de dato
$bd = $conexion->query("SELECT * FROM 1esoacalendario WHERE id=$id");
// Obtenemos los datos
$row = $bd->fetch_assoc();
// titulo
$titulo=$row['title'];
// cuerpo
$evento=$row['body'];
// Fecha inicio
$inicio=$row['inicio_normal'];
// Fecha Termino
$final=$row['final_normal'];
// Eliminar evento
if (isset($_POST['eliminar_evento']))
{
$id = evaluar($_GET['id']);
$sql = "DELETE FROM 1esoacalendario WHERE id = $id";
if ($conexion->query($sql))
{
echo "Evento eliminado";
}
else
{
echo "El evento no se pudo eliminar";
}
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title><?=$titulo?></title>
</head>
<body>
<h3><?=$titulo?></h3>
<hr>
<b>Fecha inicio:</b> <?=$inicio?>
<b>Fecha termino:</b> <?=$final?>
<p><?=$evento?></p>
</body>
<form action="" method="post">
<button type="submit" class="btn btn-danger" name="eliminar_evento">Eliminar</button>
</form>
</html>
eventos.sql
Código :
-- phpMyAdmin SQL Dump -- version 4.0.10deb1 -- http://www.phpmyadmin.net -- -- Servidor: localhost -- Tiempo de generación: 09-10-2015 a las 16:59:31 -- Versión del servidor: 5.5.44-0ubuntu0.14.04.1 -- Versión de PHP: 5.5.9-1ubuntu4.13 SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO"; SET time_zone = "+00:00"; /*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */; /*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */; /*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */; /*!40101 SET NAMES utf8 */; -- -- Base de datos: `1esoacalendario` -- -- -------------------------------------------------------- -- -- Estructura de tabla para la tabla `1esoacalendario` -- CREATE TABLE IF NOT EXISTS `1esoacalendario` ( `id` int(10) unsigned NOT NULL AUTO_INCREMENT, `title` varchar(150) COLLATE utf8_spanish_ci DEFAULT NULL, `body` text COLLATE utf8_spanish_ci NOT NULL, `url` varchar(150) COLLATE utf8_spanish_ci NOT NULL, `class` varchar(45) COLLATE utf8_spanish_ci NOT NULL DEFAULT 'event-important', `start` varchar(15) COLLATE utf8_spanish_ci NOT NULL, `end` varchar(15) COLLATE utf8_spanish_ci NOT NULL, `inicio_normal` varchar(50) COLLATE utf8_spanish_ci NOT NULL, `final_normal` varchar(50) COLLATE utf8_spanish_ci NOT NULL, PRIMARY KEY (`id`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_spanish_ci AUTO_INCREMENT=1 ; /*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */; /*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */; /*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;
funciones.php
Código :
<?php
// Evaluar los datos que ingresa el usuario y eliminamos caracteres no deseados.
function evaluar($valor)
{
$nopermitido = array("'",'\\','<','>',"\"");
$valor = str_replace($nopermitido, "", $valor);
return $valor;
}
// Formatear una fecha a microtime para añadir al evento, tipo 1401517498985.
function _formatear($fecha)
{
return strtotime(substr($fecha, 6, 4)."-".substr($fecha, 3, 2)."-".substr($fecha, 0, 2)." " .substr($fecha, 10, 6)) * 1000;
}
?>
index.php
Código :
<?php
// Definimos nuestra zona horaria
date_default_timezone_set("Europe/Madrid");
// incluimos el archivo de funciones
include 'funciones.php';
// incluimos el archivo de configuracion
include 'config.php';
// Verificamos si se ha enviado el campo con name from
if (isset($_POST['from']))
{
// Si se ha enviado verificamos que no vengan vacios
if ($_POST['from']!="" AND $_POST['to']!="")
{
// Recibimos el fecha de inicio y la fecha final desde el form
$inicio = _formatear($_POST['from']);
// y la formateamos con la funcion _formatear
$final = _formatear($_POST['to']);
// Recibimos el fecha de inicio y la fecha final desde el form
$inicio_normal = $_POST['from'];
// y la formateamos con la funcion _formatear
$final_normal = $_POST['to'];
// Recibimos los demas datos desde el form
$titulo = evaluar($_POST['title']);
// y con la funcion evaluar
$body = evaluar($_POST['event']);
// reemplazamos los caracteres no permitidos
$clase = evaluar($_POST['class']);
// insertamos el evento
$query="INSERT INTO 1esoacalendario VALUES(null,'$titulo','$body','','$clase','$inicio','$final','$inicio_normal','$final_normal')";
// Ejecutamos nuestra sentencia sql
$conexion->query($query);
// Obtenemos el ultimo id insetado
$im=$conexion->query("SELECT MAX(id) AS id FROM 1esoacalendario");
$row = $im->fetch_row();
$id = trim($row[0]);
// para generar el link del evento
$link = "$base_url"."descripcion_evento.php?id=$id";
// y actualizamos su link
$query="UPDATE 1esoacalendario SET url = '$link' WHERE id = $id";
// Ejecutamos nuestra sentencia sql
$conexion->query($query);
// redireccionamos a nuestro calendario
header("Location:$base_url");
}
}
?>
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<title>Calendario</title>
<link rel="stylesheet" type="text/css" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<link rel="stylesheet" href="<?=$base_url?>css/calendar.css">
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet">
<script type="text/javascript" src="<?=$base_url?>js/es-ES.js"></script>
<script src="<?=$base_url?>js/jquery.min.js"></script>
<script src="<?=$base_url?>js/moment.js"></script>
<script src="<?=$base_url?>js/bootstrap.min.js"></script>
<script src="<?=$base_url?>js/bootstrap-datetimepicker.js"></script>
<link rel="stylesheet" href="<?=$base_url?>css/bootstrap-datetimepicker.min.css" />
<script src="<?=$base_url?>js/bootstrap-datetimepicker.es.js"></script>
</head>
</head>
<body style="background: white;">
<div class="container">
<div class="row">
<div class="page-header"><h2></h2></div>
<div class="pull-left form-inline"><br>
<div class="btn-group">
<button class="btn btn-primary" data-calendar-nav="prev"><< Anterior</button>
<button class="btn" data-calendar-nav="today">Hoy</button>
<button class="btn btn-primary" data-calendar-nav="next">Siguiente >></button>
</div>
<div class="btn-group">
<button class="btn btn-warning" data-calendar-view="year">Año</button>
<button class="btn btn-warning active" data-calendar-view="month">Mes</button>
<button class="btn btn-warning" data-calendar-view="week">Semana</button>
<button class="btn btn-warning" data-calendar-view="day">Dia</button>
</div>
</div>
<div class="pull-right form-inline"><br>
<button class="btn btn-info" data-toggle='modal' data-target='#add_evento'>Añadir Evento</button>
</div>
</div><hr>
<div class="row">
<div id="calendar"></div> <!-- Aqui se mostrara nuestro calendario -->
<br><br>
</div>
<!--ventana modal para el calendario-->
<div class="modal fade" id="events-modal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body" style="height: 400px">
<p>One fine body…</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
</div>
<script src="<?=$base_url?>js/underscore-min.js"></script>
<script src="<?=$base_url?>js/calendar.js"></script>
<script type="text/javascript">
(function($){
//creamos la fecha actual
var date = new Date();
var yyyy = date.getFullYear().toString();
var mm = (date.getMonth()+1).toString().length == 1 ? "0"+(date.getMonth()+1).toString() : (date.getMonth()+1).toString();
var dd = (date.getDate()).toString().length == 1 ? "0"+(date.getDate()).toString() : (date.getDate()).toString();
//establecemos los valores del calendario
var options = {
// definimos que los eventos se mostraran en ventana modal
modal: '#events-modal',
// dentro de un iframe
modal_type:'iframe',
//obtenemos los eventos de la base de datos
events_source: '<?=$base_url?>obtener_eventos.php',
// mostramos el calendario en el mes
view: 'month',
// y dia actual
day: yyyy+"-"+mm+"-"+dd,
// definimos el idioma por defecto
language: 'es-ES',
//Template de nuestro calendario
tmpl_path: '<?=$base_url?>tmpls/',
tmpl_cache: false,
// Hora de inicio
time_start: '08:00',
// y Hora final de cada dia
time_end: '22:00',
// intervalo de tiempo entre las hora, en este caso son 30 minutos
time_split: '30',
// Definimos un ancho del 100% a nuestro calendario
width: '100%',
onAfterEventsLoad: function(events)
{
if(!events)
{
return;
}
var list = $('#eventlist');
list.html('');
$.each(events, function(key, val)
{
$(document.createElement('li'))
.html('<a href="' + val.url + '">' + val.title + '</a>')
.appendTo(list);
});
},
onAfterViewLoad: function(view)
{
$('.page-header h2').text(this.getTitle());
$('.btn-group button').removeClass('active');
$('button[data-calendar-view="' + view + '"]').addClass('active');
},
classes: {
months: {
general: 'label'
}
}
};
// id del div donde se mostrara el calendario
var calendar = $('#calendar').calendar(options);
$('.btn-group button[data-calendar-nav]').each(function()
{
var $this = $(this);
$this.click(function()
{
calendar.navigate($this.data('calendar-nav'));
});
});
$('.btn-group button[data-calendar-view]').each(function()
{
var $this = $(this);
$this.click(function()
{
calendar.view($this.data('calendar-view'));
});
});
$('#first_day').change(function()
{
var value = $(this).val();
value = value.length ? parseInt(value) : null;
calendar.setOptions({first_day: value});
calendar.view();
});
}(jQuery));
</script>
<div class="modal fade" id="add_evento" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="false">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="myModalLabel">Agregar nuevo evento</h4>
</div>
<div class="modal-body">
<form action="" method="post">
<label for="from">Inicio</label>
<div class='input-group date' id='from'>
<input type='text' id="from" name="from" class="form-control" readonly />
<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
</div>
<br>
<label for="to">Final</label>
<div class='input-group date' id='to'>
<input type='text' name="to" id="to" class="form-control" readonly />
<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
</div>
<br>
<label for="tipo">Tipo de evento</label>
<select class="form-control" name="class" id="tipo">
<option value="event-info">Deberes</option>
<option value="event-success">Salidas</option>
<option value="event-important">Controles</option>
<option value="event-special">vacaciones</option>
</select>
<br>
<label for="title">Título</label>
<input type="text" required autocomplete="off" name="title" class="form-control" id="title" placeholder="Introduce un título">
<br>
<label for="body">Evento</label>
<textarea id="body" name="event" required class="form-control" rows="3"></textarea>
<script type="text/javascript">
$(function () {
$('#from').datetimepicker({
language: 'es',
minDate: new Date()
});
$('#to').datetimepicker({
language: 'es',
minDate: new Date()
});
});
</script>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-danger" data-dismiss="modal"><i class="fa fa-times"></i> Cancelar</button>
<button type="submit" class="btn btn-success"><i class="fa fa-check"></i> Agregar</button>
</form>
</div>
</div>
</div>
</div>
</body>
</html>
obtener_eventos.php
Código :
<?php
// Incluimos nuestro archivo config
include 'config.php';
// Sentencia sql para traer los eventos desde la base de datos
$sql="SELECT * FROM 1esoacalendario";
// Verificamos si existe un dato
if ($conexion->query($sql)->num_rows)
{
// creamos un array
$datos = array();
//guardamos en un array multidimensional todos los datos de la consulta
$i=0;
// Ejecutamos nuestra sentencia sql
$e = $conexion->query($sql);
while($row=$e->fetch_array()) // realizamos un ciclo while para traer los eventos encontrados en la base de dato
{
// Alimentamos el array con los datos de los eventos
$datos[$i] = $row;
$i++;
}
// Transformamos los datos encontrado en la BD al formato JSON
echo json_encode(
array(
"success" => 1,
"result" => $datos
)
);
}
else
{
// Si no existen eventos mostramos este mensaje.
echo "No hay datos";
}
?>
Intenté modificar a mi gusto todo lo que pude me fue bien, al entrar en el calendario y clicar en "añadir evento" relleno todos los datos y le doy aceptar, me reacciona al calendario pero no me guarda los datos y tengo toda la tabla bien, no entiendo que pasó. Que hay mal? Y no viene con instrucciones paso a paso
id varchar(1000) utf8_spanish_ci
title varchar(10) utf8_spanish_ci
body varchar(10000) utf8_spanish_ci
url varchar(150) utf8_spanish_ci
class varchar(45) utf8_spanish_ci
start varchar(15) utf8_spanish_ci
end varchar(15) utf8_spanish_ci
inicio_normal varchar(50) utf8_spanish_ci
final_normal varchar(50) utf8_spanish_ci
Gracias
