<!
DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Registro de Nuevo Curso</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
margin: 0;
padding: 20px;
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
.container {
background-color: #fff;
padding: 30px;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
width: 100%;
max-width: 500px;
h1 {
text-align: center;
color: #333;
margin-bottom: 20px;
label {
display: block;
margin-bottom: 8px;
font-weight: bold;
color: #555;
input[type="text"],
textarea {
width: calc(100% - 20px);
padding: 10px;
margin-bottom: 20px;
border: 1px solid #ddd;
border-radius: 4px;
box-sizing: border-box; /* Incluye padding y border en el ancho total */
textarea {
resize: vertical; /* Permite redimensionar verticalmente */
min-height: 100px;
input[type="submit"] {
background-color: #007bff;
color: white;
padding: 12px 20px;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 16px;
width: 100%;
input[type="submit"]:hover {
background-color: #0056b3;
.back-link {
display: block;
text-align: center;
margin-top: 20px;
color: #007bff;
text-decoration: none;
.back-link:hover {
text-decoration: underline;
</style>
</head>
<body>
<div class="container">
<h1>Registrar Nuevo Curso</h1>
<form action="[Link]" method="POST">
<label for="nombreCurso">Nombre del Curso:</label>
<input type="text" id="nombreCurso" name="nombreCurso" required>
<label for="nombreCortoCurso">Nombre Corto del Curso:</label>
<input type="text" id="nombreCortoCurso" name="nombreCortoCurso" required>
<label for="observacionesCurso">Observaciones:</label>
<textarea id="observacionesCurso" name="observacionesCurso"></textarea>
<input type="submit" value="Registrar Curso">
</form>
<a href="[Link]" class="back-link">Volver a la lista de cursos</a>
</div>
</body>
</html>
Conexion
<?php
function conectar(){
$host = "localhost";
$user ="root";
$pass ="";
$bd ="prueba";
$con=mysqli_connect($host,$user,$pass);
mysqli_select_db($con,$bd);
if($con->connect_errno) {
echo "Error de conexión con la base de datos: " . $mysqli_conexion->connect_errno;
} else {
echo "";
return $con;
?>
Registrar el curso
<?php
// 1. Configuración de errores (siempre al principio para depuración)
// Esto asegura que cualquier error de PHP sea visible. REMOVER EN PRODUCCIÓN.
ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL);
// Incluye tu archivo de conexión a la base de datos
include("[Link]");
// Variable para almacenar el mensaje de éxito o error después de un intento de registro
$mensaje_feedback = "";
// Variable para almacenar los datos del curso recién registrado, si la inserción fue exitosa
$datos_curso_registrado = null;
// 2. Lógica para procesar el formulario cuando se envía (método POST)
if ($_SERVER["REQUEST_METHOD"] == "POST") {
// Establece la conexión a la base de datos
$con = conectar();
// Recoge los datos del formulario de manera segura, usando el operador null coalescing (??)
// para evitar warnings si la variable POST no está definida.
$nombre = $_POST['nombreCurso'] ?? '';
$nombreCorto = $_POST['nombreCortoCurso'] ?? '';
$observaciones = $_POST['observaciones'] ?? '';
// Validación básica del lado del servidor: asegúrate de que los campos obligatorios no estén vacíos.
if (!empty($nombre) && !empty($nombreCorto)) {
// Prepara la consulta SQL para insertar los datos de forma segura (previniendo inyección SQL)
$stmt = $con->prepare("INSERT INTO curso (nombreCurso, nombreCortoCurso, observaciones)
VALUES (?, ?, ?)");
// 'sss' indica que los tres parámetros que se van a vincular son de tipo string (cadena de texto)
$stmt->bind_param("sss", $nombre, $nombreCorto, $observaciones);
// Ejecuta la consulta preparada
if ($stmt->execute()) {
$mensaje_feedback = "¡Curso '$nombre' registrado con éxito!";
// Guarda los datos recién ingresados para mostrarlos en la página
$datos_curso_registrado = [
'nombre' => $nombre,
'nombrecorto' => $nombreCorto,
'observaciones' => $observaciones
];
} else {
// Si la ejecución falla, captura el error de la base de datos
$mensaje_feedback = "Error al registrar el curso: " . $stmt->error;
// Cierra el statement para liberar recursos
$stmt->close();
} else {
$mensaje_feedback = "Error: Por favor, complete los campos de Nombre del Curso y Nombre Corto
del Curso.";
// Cierra la conexión a la base de datos
$con->close();
// NOTA: Si la página se carga por primera vez (método GET), no se ejecuta la lógica de POST,
// y se procede directamente a mostrar el formulario.
?>
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Registrar Curso</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
margin: 0;
padding: 20px;
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
.container {
background-color: #fff;
padding: 30px;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
width: 100%;
max-width: 600px; /* Ajustado para una mejor visualización de los datos */
h1 {
text-align: center;
color: #333;
margin-bottom: 20px;
/* Estilos para los mensajes de retroalimentación */
.feedback-message {
padding: 10px;
margin-bottom: 20px;
border-radius: 4px;
text-align: center;
font-weight: bold;
.[Link] {
background-color: #d4edda; /* Verde claro */
color: #155724; /* Verde oscuro */
border: 1px solid #c3e6cb;
.[Link] {
background-color: #f8d7da; /* Rojo claro */
color: #721c24; /* Rojo oscuro */
border: 1px solid #f5c6cb;
/* Estilos del formulario */
label {
display: block;
margin-bottom: 8px;
font-weight: bold;
color: #555;
input[type="text"],
textarea {
width: calc(100% - 20px); /* Ajusta ancho para padding */
padding: 10px;
margin-bottom: 20px;
border: 1px solid #ddd;
border-radius: 4px;
box-sizing: border-box; /* Incluye padding y borde en el ancho total */
textarea {
resize: vertical; /* Permite redimensionar verticalmente */
min-height: 100px;
input[type="submit"] {
background-color: #28a745; /* Botón de registro verde */
color: white;
padding: 12px 20px;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 16px;
width: 100%;
input[type="submit"]:hover {
background-color: #218838;
/* Estilos para mostrar los datos del curso recién registrado */
.last-registered-data {
background-color: #e9ecef; /* Gris claro */
padding: 15px;
border-radius: 5px;
margin-bottom: 20px;
border: 1px solid #ced4da;
.last-registered-data p {
margin: 5px 0;
.last-registered-data strong {
color: #333;
/* Enlace para volver a la lista general */
.back-to-list {
display: block;
text-align: center;
margin-top: 20px;
color: #007bff;
text-decoration: none;
.back-to-list:hover {
text-decoration: underline;
</style>
</head>
<body>
<div class="container">
<h1>Registrar Nuevo Curso</h1>
<?php
// Muestra el mensaje de retroalimentación (éxito o error) si existe
if (!empty($mensaje_feedback)) {
$clase_mensaje = (strpos($mensaje_feedback, 'Error') !== false) ? 'error' : 'success';
echo '<div class="feedback-message ' . $clase_mensaje . '">' . $mensaje_feedback . '</div>';
// Muestra los datos del curso recién registrado si la inserción fue exitosa
if ($datos_curso_registrado) {
echo '<div class="last-registered-data">';
echo '<h2>Último Curso Registrado:</h2>';
echo '<p><strong>Nombre:</strong> ' . htmlspecialchars($datos_curso_registrado['nombre']) .
'</p>';
echo '<p><strong>Nombre Corto:</strong> ' .
htmlspecialchars($datos_curso_registrado['nombrecorto']) . '</p>';
echo '<p><strong>Observaciones:</strong> ' .
htmlspecialchars($datos_curso_registrado['observaciones']) . '</p>';
echo '</div>';
echo '<h3>Registrar Otro Curso</h3>'; // Título para indicar que se puede seguir registrando
?>
<form action="[Link]" method="POST">
<label for="nombreCurso">Nombre del Curso:</label>
<input type="text" id="nombreCurso" name="nombreCurso" required>
<label for="nombreCortoCurso">Nombre Corto del Curso:</label>
<input type="text" id="nombreCortoCurso" name="nombreCortoCurso" required>
<label for="observacionesCurso">Observaciones:</label>
<textarea id="observacionesCurso" name="observacionesCurso"></textarea>
<input type="submit" value="Registrar Curso">
</form>
<a href="[Link]" class="back-