Completed

Wizard con validación y notificaciones de datos usando Bootstrap, php, Mysql, Jquery y Sweetalert

Published on the March 05, 2021 in IT & Programming

About this project

Open

Usualmente los wizard basados en bootstrap se utilizan para el proceso de registro de algún proceso.
En este caso requiero un wizard similar, pero con los siguientes requerimientos específicos.

Mi base inicial es este wizard, pero se puede tomar uno similar.
https://bootsnipp.com/snippets/4Knm


1.    Cabeceras de los pasos que incluyan iconos (Font Awsome)
2.
Cuando un paso se completa, se podrá actualizar el icono, el color de la cabecera o el color del texto de la cabecera
3.    Cada paso deberá contener un formulario
4.    El formulario deberá tener un campo de texto y éste deberá ser enfocado (autofocus)
5.
El formulario no considerará un botón de “Siguiente” sino más bien al ingresar el dato en el campo de texto y dar <enter> pasará al siguiente paso.
6.    Al ingresar un dato en el formulario y dar <enter> deberá hacer una validación contra base de datos (MySQL) para obtener una bandera para permitir pasar al siguiente paso o no. Abajo pseudo código:

if(isset($_POST['submit']))
{
Include (‘valida_paso1.php’);

    if ($step_ok =1 ) // Si el proceso es válido,
    {
        ----> 1. guardo variables de sesion o hago algo <-------
----> 2.
defino características del mensaje <-------
    $show_message=
$msg_icon=
    $msg_title=
    $text_text=
    $timer=
    $button=
        ----> 3. Promuevo al siguiente paso <-------
    }
    else {
----> 2. Defino características del mensaje <-------
    $show_message=
$msg_icon=
    $msg_title=
    $text_text=
    $timer=
    $button=
}
}



7.
Dependiendo de la variable $show_message, se deberá o no desplegar un mensaje basado en sweet alert.
8.    Al completar el ultimo paso, y al validar que todo está OK, se dirigirá a un script php diferente.
9.    El wizard puede tener la opción de reiniciar el proceso pasando al 1er paso.

Referencias
SWEET Alert https://lipis.github.io/bootstrap-sweetalert/

Category IT & Programming
Subcategory Web development
What is the scope of the project? Medium-sized change
Is this a project or a position? Project
I currently have I have specifications
Required availability As needed
Roles needed Developer

Delivery term: Not specified

Skills needed