7 plugins para trabajar con textareas

1 COMENTARIO -  Publicado hace 12 meses -  Clasificado en: ,

En el blog de Steve Reynolds he encontrado una interesante lista de plugins de jQuery para la manipulación de textareas.

Plugins para manipular textareas - Mark it up es un enriquecedor de texto para jQuery

7 jQuery Plugins to Manipulate TEXTAREAs » »

 

Redimensionar un textarea con Prototype

0 COMENTARIOS -  Publicado hace 38 meses -  Clasificado en: , ,

Para un proyecto en el que estoy trabajando, que tiene bastantes textareas, necesitaba una forma de optimizar el espacio disponible. Así que navegando por internet, y buscando posibles alternativas -a ser posible que utilizasen Protoype-, me encontré con esta opción de redimensionar textareas dinamicamente con Ajax. Modifiqué ligeramente el código para ajustar el redimensionamiento un poco mejor y la verdad es que me permite optimizar mucho mejor el espacio en la retícula. Los textarea únicamente ocuparán el espacio del texto que contienen.

Ver Ejemplo en funcionamiento » »

Para utilizarlo hay que:

1.- Descargarse Prototype y hacer el enlace oportuno en nuestra web: 

<script language="javascript" src="Prototype.js"></script>

2.- Dentro de la etiqueta <head> insertar el siguiente código: 

var RedimenTextArea = Class.create();

RedimenTextArea.prototype = {
    FilasDefecto: 1,

    initialize: function(field)
    {
        this.FilasDefecto = Math.max(field.rows, 1);
        this.redimensiona = this.redimensiona.bindAsEventListener(this);
        Event.observe(field, "click", this.redimensiona);
        Event.observe(field, "keyup", this.redimensiona);
    },

    redimensiona: function(event)
    {
        var t = Event.element(event);
        var lineas = t.value.split('\n');
        var FilasAhora = lineas.length-1;
        var FilasAntes = t.rows;
        for (var i = 0; i < lineas.length; i++)
        {
            var linea = lineas[i];
            if (linea.length >= t.cols) FilasAhora += Math.floor(linea.length / t.cols);
        }
        if (FilasAhora > t.rows) t.rows = FilasAhora;
        if (FilasAhora < t.rows) t.rows = Math.max(this.FilasDefecto, FilasAhora);
    }
}

Descargar Ejemplo » »

 

Seleccionar todo en un textarea

0 COMENTARIOS -  Publicado hace 48 meses -  Clasificado en: , ,

El siguiente script muestra como seleccionar todo el texto de un textarea. Hacemos que gane el foco (this.form.cajatexto.focus()) y aplicamos select() para obtener un efecto similar a Edición > Seleccionar Todo (this.form.cajatexto.select()).

El siguiente script muestra como seleccionar todo el texto de un textarea. Hacemos que gane el foco (this.form.cajatexto.focus()) y aplicamos select() para obtener un efecto similar a Edición > Seleccionar Todo (this.form.cajatexto.select()). 

<form>
<textarea name="cajatexto" rows="10" cols="80">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla interdum leo eget sapien. Duis eu metus sit amet massa lacinia imperdiet. Donec dolor. Phasellus scelerisque tempus felis. Fusce fringilla. Sed faucibus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Mauris hendrerit, dui a porta aliquam, risus enim imperdiet felis, quis pharetra orci augue eget tellus. Ut mi. Cras faucibus vestibulum risus. Integer at diam. Nunc orci mi, faucibus et, vehicula sed, tempor et, nulla.  </textarea>  <br />  
<input name="button" type="button" onclick="javascript:this.form.cajatexto.focus();this.form.cajatexto.select();" value="Seleccionar Todo" />  </form>

Algunas entradas relacionadas:

 
Páginas: 1