Un nuevo formulario para completar la compra

Hice algunas modificaciones en el modal

Codigo Completo

<form action="">
             <div class="row">
               <div  class="form-label col">
                 <div class="input-group mb-3">
                   <span class="input-group-text" id="basic-addon1">@</span>
                   <input type="text" class="form-control" placeholder="Username" aria-label="Username" aria-describedby="basic-addon1">
                 </div>
               </div>
             </div>
           </form>
           <!-- Alerta -->
           <div class="alert alert-warning" role="alert">
             Recibiras un correo de confirmacion si ganas el Sorteo!
           </div>
           <!-- Alerta -->

Brutal curso, he aprendido algo que me llamaba la atención hace mucho y pues sería genial especializarse en esos frameworks que facilitan los procesos de maquetación 🏆

muy buena clase y la manera de utilizar

se termino! y me encanto!!

Así lo hice sencillo

Definitivamente Bootstrap lleva nuestros sitios web a otro nivel.

Genial, gran curso, muy importante

Al agregar un nuevo formulario, tendríamos 2 formularios en la misma pagina , si se hiciera un submit , se enviaría los datos de ambos formularios?

Adaptando el modal con un formulario relacionado:

Excelente curso, no hay más que decir

Así lo hice sencillo

Que otro rollo bootstrap 😃

Seria interesante hacer esta misma pagina con django por ejemplo.

Bootstrap es demasiado útil y práctico. Quiero profundizar más en esto.

Muy buena clase.

Muy buen curso, simple, rápido y sencillo. Sacha es un excelente profesor

Este es el Codigo del modal usando Bootstrap v5.1:

el tag

<form>

debe ser usado con al clase

was-validated

para que funcione la validacion.

<!-- Modal -->
<div class="modal fade" id="modalCompra" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Buy Products</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>

      <div class="modal-body">
        <form class="was-validated">
        
              <div class="input-group mb-3">
                <span class="input-group-text" id="basic-addon1">@</span>
                <input type="text" class="form-control" placeholder="Username" aria-label="Username" aria-describedby="basic-addon1">
              </div>

              <div class="input-group mb-3">
                <input type="password" class="form-control" id="floatingPassword" placeholder="Password">
                <!-- <label for="floatingPassword">Password</label> -->
              </div>

              <div class="form-check mb-3">
                <input type="checkbox" class="form-check-input" id="validationFormCheck1" required>
                <label class="form-check-label" for="validationFormCheck1">Check this checkbox</label>
                <div class="invalid-feedback">Example invalid feedback text</div>
              </div>

          </form>

          <div class="alert alert-warning" role="alert">
            You will be receving an email.
          </div>

        </div>
          

      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Maybe Later, thanks</button>
        <button type="button" class="btn btn-special">Buy now Bro</button>
      </div>
    </div>
  </div>
</div>
<!-- Modal -->

creo que puedo hacer sitios más bonitos 😃

Para que envia los datos al correo que tiene que hacer tu pagina, o alguien sabe como hacerlo?

+2

buen curso

Excelente curso

Muy buen curso.

No había usado alerts, pero me agrado como se ven.

Brutal el formulario.

Bootstrap ta buenisimo

Yo lo realice de este modo uwu

Me gusto mucho este curso, deberían sacar algunos más…

actualicen el curso

Más Bootstrap más tiempo de vida jaja

Que genial!!

Fácil de utilizar, muchas gracias.

genial todo este curso

Bootstrap es una increíble herramienta para desarrollar, lo usare para desarrollar mi portafolio y subirlo a GitHub

Me encantan estas clases interactivas de verdad siento que aprendo más.

f