Cuando estamos desarrollando una extensión para Joomla!, o modificando una existente, puede ocurrirnos, como me ha pasado a mi, que tengamos que validar con javacript un campo de textarea. Hasta aquí parece sencillo.
Pero, ¿Qué ocurre si tenemos un editor WYSIWYG como es JCE? Aquí la cosa cambia un poco y la validación hay que realizarla de otra manera..
1/ La manera normal
Tenemos un textarea con el nombre "contenido":
<textarea name="contenido"></textarea>
Para validar:
<script languaje=javascript>
function validar(){
if (document.miformulario.contenido.value.length==0) {
alert("textarea vacio");
return false;
} else
return true;
}
</script>
2/ Mediante getElementById
Tenemos un textarea con el nombre "contenido":
<textarea name="contenido" id="contenido"></textarea>
Para validar:
<script languaje=javascript>
function validar(){
var contenido_validar = document.getElementById("contenido");
if (contenido_validar.value.length==0) {
alert("textarea vacio");
return false;
} else
return true;
}
</script>
3/ Con JCE
JCE es un editor WYSIWYG para Joomla! muy completo y que recomiendo para utilizar en vuestro sitio web.
Lo que hace este editor, es ocultarnos nuestro campo textarea y añadir un iframe con un html que es precisamente el editor.
Por lo tanto, al hacer este procedimiento, no nos valen las anteriores funciones de validar que hemos explicado anteriormente.
Para poder acceder al contenido que estamos editando, tenemos que hacer lo siguiente:
<script languaje=javascript>
function validar(){
var mi_iframe = document.getElementById("id_del_iframe");
var contenido = mi_iframe.contentWindow.document.body.innerHTML;
if (contenido.length<=19) {
alert("textarea vacio");
return false;
} else
return true;
}
</script>
La pregunta ahora será la siguiente: ¿Por qué menos o igual que 19? Pues porque el editor JCE siempre tiene puesto un <br _mce_bogus="1"> por defecto, cuya longitud es 19.
Espero que esto le pueda venir bien a alguien.
