<htlml>
  <head>

    <link rel="stylesheet" href="../ArchivosCSS/toastr.min.css">
  </head>
  <div class="modal fade" id="Crear" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true"
  data-bs-backdrop="static" data-bs-keyboard="false">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h1 class="modal-title fs-5" id="exampleModalLabel">Registrar clientes</h1>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">
        
        <style>
          .Mayusc{
            text-transform: capitalize;
          }
        </style>

        <form method="POST" action="./controladores/DatosP/register_datosp.php">

          <div class="form-group">
            <label for="recipient-name" class="col-form-label">Cedula</label>
            <input type="number" name="cedula" class="form-control"  required="true">
          </div>

          <div class="form-group">
            <label for="recipient-name" class="col-form-label">Nombre</label>
            <input type="text" name="nombre" class="form-control Mayusc"  required="true">
          </div>

          <div class="form-group">
            <label for="recipient-name" class="col-form-label">Apellido</label>
            <input type="text" name="apellido" class="form-control Mayusc"  required="true">
          </div>

          <div class="form-group">
            <label for="recipient-name" class="col-form-label">Direccion</label>
            <input type="text" name="direccion" class="form-control Mayusc"  required="true">
          </div>

          <div class="form-group">
            <label for="recipient-name" class="col-form-label">Telefono</label>
            <input type="tel" name="telefono" class="form-control"  required="true">
          </div>

          <div class="form-group">
            <label for="recipient-name" class="col-form-label">Correo</label>
            <input type="email" name="correo" class="form-control"  required="true">
          </div>
          <input type="hidden" value="2" name="tipo" id="TipoC">

          <div class="modal-footer">
           <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cerrar</button>
           <button type="submit" class="btn btn-primary" id="btn">Guardar</button>
         </div>
       </div>
     </div>
   </div>

 </form>

 <script src="../ArchivosJS/jquery-3.6.0.min.js"></script> 
 <script src="../ArchivosJS/toastr.min.js"></script>
 <script>
  


  const tipoCliente = document.getElementById('TipoC');
  const tipoProveedor = document.getElementById('TipoP');
  const camposProveedor = document.getElementById('campos-proveedor');

  tipoCliente.addEventListener('change', function() {
    camposProveedor.style.display = 'none';
    tipoProveedor.disabled = false;
  });

  tipoProveedor.addEventListener('change', function() {
    camposProveedor.style.display = 'block';
    tipoCliente.checked = false;
    
  });

</script>
<script type="text/javascript">
  $(document).ready(function(){
    $("#btn").click(function(){
     toastr["success"]("SE HA REGISTRADO EXITOSAMENTE");
     
   });
    toastr.options = { "positionClass": "toast-bottom-right","showDuration": "500","preventDuplicates": true
  };
});

</script>
</html>