Entradas de datos (Input Textarea)

Descubre la simplicidad y flexibilidad de Quickly para diseñar formularios con entradas de área de texto personalizadas. Aplica estilos y personalízalas fácilmente para que se adapten a tu diseño de manera intuitiva y atractiva. Nuestra biblioteca de estilos garantiza que los campos de texto sean visualmente consistentes y funcionalmente precisos, facilitando la entrada de contenido textual y mejorando la experiencia del usuario.

Entrada Tipo Área de Texto

Las entradas de área de texto están diseñadas específicamente para aceptar contenido textual de forma flexible y extensa. Utiliza estas entradas para recolectar comentarios, descripciones largas, y cualquier otra información detallada de tus usuarios. La validación adecuada asegura que el contenido ingresado cumpla con los requisitos establecidos, mejorando la precisión y utilidad de los datos recolectados.

Atributo / Clase Descripción
required Para activar la validación de los campos, debes especificar el atributo.
disabled / .disabled Para deshabilitar el campo, debes especificar el atributo correspondiente o la clase.

Ejemplo

¡Texto ok!
¡Texto error!
¡Texto ok!
¡Texto error!
¡Texto ok!
¡Texto error!
HTML 
     
    <!-- Requerido -->  
    <div class="form-group">
        <label for="textarea" class="form-label">Área de Texto (Requerido)</label>
        <textarea class="form-control" id="textarea" value="" name="textarea" placeholder="Escribe tu consulta aquí" required aria-required="true" aria-describedby="textarea-instruccion"></textarea>
        <div class="valid-feedback">¡Texto ok!</div>
        <div class="invalid-feedback">¡Texto error!</div>      
    </div>          
    
    <!-- No Requerido --> 
    <div class="form-group">
        <label for="textarea" class="form-label">Área de Texto (No Requerido)</label>
        <textarea class="form-control" id="textarea" value="" name="textarea" placeholder="Escribe tu consulta aquí" aria-required="true" aria-describedby="textarea-instruccion"></textarea>
        <div class="valid-feedback">¡Texto ok!</div>
        <div class="invalid-feedback">¡Texto error!</div>   
    </div>   
    
    <!-- Deshabilitado -->    
    <div class="form-group">
        <label for="textarea" class="form-label">Área de Texto (Deshabilidato)</label>
        <textarea class="form-control" id="textarea" value="" name="textarea" placeholder="Escribe tu consulta aquí" disabled aria-required="true" aria-describedby="textarea-instruccion"></textarea>
        <div class="valid-feedback">¡Texto ok!</div>
        <div class="invalid-feedback">¡Texto error!</div>   
    </div>