lunes, 28 de noviembre de 2011

Validación CKEditor con jQuery

No voy a mostrar como validar un formulario completo con jQuery, sino como validar un textarea en el cual estamos empleando CKEditor.





Si tratamos de validar un textarea en el cual estamos utilizando el plugin CKEditor por el nombre que le hemos asignado a ese textarea, comprobaremos que la validación no se realiza. Si navegamos en el codigo que CKEditor agrega a un textarea, podemos ver
que el valor que se envia es el contenido del iframe con id cke_contents_mi_textarea. Sabiendo el id podremos guardar el contenido en una variable, posteriormente le quito a esa variable todas las etiquetas html que pudiese haber.Ya conociendo el valor que hay en nuestro textarea podremos realizar las comprobaciones necesarias para completar la validación de nuestro formulario con jQuery o javascript.
var cadena = $('#cke_contents_mi_textarea iframe').contents().
                  find('body').html();
cadena = cadena.replace(/<[^>]+>/g,'');
    
if (cadena=="") 
{
  /* Aqui van las acciones jQuery */ 
}

4 comentarios :

  1. El ejemplo no esta muy explícito. Si puedieras dar un ejemplo con todo y nombre del textarea o del id del textarea. Gracias

    ResponderEliminar
    Respuestas
    1. A ver si me explico bien: si el id de tu textarea es idtextarea, para capturar el texto que esta escrito en el deberás hacerlo con $('#cke_contents_idtextarea iframe').contents().find('body').html(); al que posteriormente debes quitarle posibles caracteres html con replace(/<[^>]+>/g,''), el resultado será el texto escrito en el textarea.

      En el ejemplo que pongo todo esto lo voy haciendo sobre la variable cadena que por ultimo compruebo si esta en blanco para mostrar mensajes de alerta o cualquier otra acción que sea necesaria

      Espero que esta vez lo entiendas mejor...

      Eliminar
  2. Muchas gracias por el código!

    Saludos, Raúl

    ResponderEliminar
  3. En mi caso, las lineas de codigo eran así:

    var cadena = $('#cke_miTextArea iframe').contents().find('body').html();
    cadena = cadena.replace(/<[^>]+>/g,'');

    Sin el 'contents_' en el id.

    Con eso ya me funciona, gracias

    ResponderEliminar