<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link href='https://unpkg.com/boxicons@2.0.9/css/boxicons.min.css' rel='stylesheet'> <link rel="stylesheet" href="css/form.css"> <title>AdminSite</title> </head> <body> <!-- SIDEBAR --> <section id="sidebar"> <a href="inicio.html" class="brand"><i class='bx bx-code-alt icon' ></i> LANIA</a> <!-- <a href="#" class="brand"> <img src="img/lania_logo.png" alt="Logo" style="height: 40px;"> </a> --> <ul class="side-menu"> <li><a href="#" class="active"><i class='bx bxs-dashboard icon' ></i> Dashboard</a></li> <li class="divider" data-text="main">Main</li> <li> <a href="#"><i class='bx bxs-inbox icon' ></i> Elements <i class='bx bx-chevron-right icon-right' ></i></a> <ul class="side-dropdown"> <li><a href="#">Alert</a></li> <li><a href="#">Badges</a></li> <li><a href="#">Breadcrumbs</a></li> <li><a href="#">Button</a></li> </ul> </li> <li><a href="#"><i class='bx bxs-chart icon' ></i> Charts</a></li> <li><a href="#"><i class='bx bxs-widget icon' ></i> Widgets</a></li> <li class="divider" data-text="table and forms">Table and forms</li> <li><a href="#"><i class='bx bx-table icon' ></i> Tables</a></li> <li> <a href="#"><i class='bx bxs-notepad icon' ></i> Formularios <i class='bx bx-chevron-right icon-right' ></i></a> <ul class="side-dropdown"> <li><a href="form_datos_basicos.html">Datos Básicos</a></li> <li><a href="form_datos_extendidos.html">Datos Extendidos</a></li> </ul> </li> </ul> <!-- <div class="ads"> <div class="wrapper"> <a href="#" class="btn-upgrade">Upgrade</a> <p>Become a <span>PRO</span> member and enjoy <span>All Features</span></p> </div> </div> --> </section> <!-- SIDEBAR --> <!-- NAVBAR --> <section id="content"> <!-- NAVBAR --> <nav> <i class='bx bx-menu toggle-sidebar' ></i> <form action="#"> <div class="form-group"> <input type="text" placeholder="Buscar..."> <i class='bx bx-search icon' ></i> </div> </form> <a href="#" class="nav-link"> <i class='bx bxs-bell icon' ></i> <span class="badge">5</span> </a> <a href="#" class="nav-link"> <i class='bx bxs-message-square-dots icon' ></i> <span class="badge">8</span> </a> <span class="divider"></span> <div class="profile"> <img src="https://images.unsplash.com/photo-1517841905240-472988babdf9?ixid=MnwxMjA3fDB8MHxzZWFyY2h8NHx8cGVvcGxlfGVufDB8fDB8fA%3D%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60" alt=""> <ul class="profile-link"> <li><a href="#"><i class='bx bxs-user-circle icon' ></i> Profile</a></li> <li><a href="#"><i class='bx bxs-cog' ></i> Settings</a></li> <li><a href="#"><i class='bx bxs-log-out-circle' ></i> Logout</a></li> </ul> </div> </nav> <!-- NAVBAR --> <!-- MAIN --> <main> <h1 class="title">Datos Extendidos</h1> <ul class="breadcrumbs"> <li><a href="#">Formularios</a></li> <li class="divider">/</li> <li><a href="#" class="active">Datos Extendidos</a></li> </ul> <div class="form-container"> <form id="formulario-datos-extendido" method="post" action="#"> <div class="form-section"> <br> <h3>Ubicación</h3> <br> <div class="form-row"> <input type="hidden" id="id_candidato" name="id_candidato"> <div class="form-col"> <div class="form-group"> <label for="id_pais" class="required">País</label> <select id="id_pais" name="id_pais" required> <option value="">Seleccione...</option> <!-- Aquí irían los países desde la base de datos --> <option value="1">México</option> <option value="2">Otro</option> </select> </div> </div> <div class="form-col"> <div class="form-group"> <label for="codigo_postal" class="required">Código Postal</label> <input type="number" min="0" step="1" id="codigo_postal" name="codigo_postal" maxlength="10" required> <button type="button" id="buscarBtn"><span class="material-icons">search</span>Buscar</button> </div> </div> <div class="form-col"> <div class="form-group"> <label for="id_estado">Estado</label> <select id="id_estado" name="id_estado"> <option value="">Seleccione...</option> <!-- Aquí irían los estados desde la base de datos --> </select> </div> </div> </div> <div class="form-row"> <div class="form-col"> <div class="form-group"> <label for="id_municipio">Municipio</label> <select id="id_municipio" name="id_municipio"> <option value="">Seleccione...</option> <!-- Aquí irían los municipios desde la base de datos --> </select> </div> </div> <div class="form-col"> <div class="form-group"> <label for="id_colonia">Colonia</label> <select id="id_colonia" name="id_colonia"> <option value="">Seleccione...</option> <!-- Aquí irían las colonias desde la base de datos --> </select> </div> </div> </div> </div> <!-- Sección 3: Información Académica y Laboral --> <div class="form-section"> <br> <h3>Información Académica/Laboral</h3> <br> <div class="form-row"> <div class="form-col"> <div class="form-group"> <label for="id_nivel" class="required">Nivel de Estudios</label> <select id="id_nivel" name="id_nivel" required> <option value="">Seleccione...</option> <option value="1">Primaria</option> <option value="2">Secundaria</option> <option value="3">Bachillerato</option> <option value="4">Técnico Superior Universitario</option> <option value="5">Licenciatura</option> <option value="6">Maestría</option> <option value="7">Doctorado</option> <option value="8">Otro</option> </select> </div> </div> <div class="form-col"> <div class="form-group"> <label for="id_giro" class="required">Giro</label> <select id="id_giro" name="id_giro" required> <option value="">Seleccione...</option> <option value="1">Tecnologías de la Información</option> <option value="2">Gobierno</option> <option value="3">Finanzas</option> <option value="4">Salud</option> <option value="5">Educación</option> <option value="6">Telecomunicaciones</option> <option value="7">Retail</option> <option value="8">Manufactura</option> <option value="9">Logística y Transporte</option> <option value="10">Construcción</option> <option value="11">Turismo y Hospitalidad</option> <option value="12">Energía y Recursos Naturales</option> <option value="13">Agricultura y Alimentación</option> <option value="14">Medios de Comunicación y Entretenimiento</option> <option value="15">Otros</option> </select> </div> </div> </div> <div class="form-group"> <label for="nombre_empresa">Nombre de la Empresa/Institución</label> <input type="text" id="nombre_empresa" name="nombre_empresa" maxlength="100"> </div> <div class="form-group"> <label for="motivo_examen">Motivo del Examen</label> <textarea id="motivo_examen" name="motivo_examen" rows="3"></textarea> </div> </div> <!-- Sección 4: Evaluación y Consentimiento --> <div class="form-section"> <br> <h3>Evaluación y Consentimiento</h3> <br> <div class="form-group"> <p>Calificación del Servicio</p> <br> <label for="calificacion_servicio">¿Qué tan satisfecho estás con nuestra institución en general, considerando la calidad de las instalaciones, la atención del personal y el proceso de certificación?</label> <br> <select id="calificacion_servicio" name="calificacion_servicio" class="select-emoji"> <option value="">Seleccione una calificación...</option> <option value="1">😡 Muy insatisfecho</option> <option value="2">😕 Insatisfecho</option> <option value="3">😐 Neutral</option> <option value="4">🙂 Satisfecho</option> <option value="5">😄 Muy satisfecho</option> </select> </div> <br> <div class="form-group"> <input type="checkbox" id="consentimiento_pub" name="consentimiento_pub" value="1" checked> <label for="consentimiento_pub" style="display: inline;">Doy mi consentimiento para la publicación de mis datos</label> </div> </div> <br> <button type="submit" class="btn-submit">Enviar</button> <div id="mensaje-error" class="mensaje-error"></div> </form> </div> </main> <!-- MAIN --> </section> <!-- NAVBAR --> <script src="js/form.js"></script> <script src="js/form_datos_extendidos.js"></script> <script src="js/buscarCodigo.js"></script> <script src="https://website-widgets.pages.dev/dist/sienna.min.js" defer></script> </body> </html>