¿Cómo comprobar si CKEditor tiene texto?

Question

Tengo un formulario HTML con algunos campos. Uno de ellos es un área de texto administrada por CKEditor.

Cuando el usuario desea enviar el formulario, quiero verificar si ingresó valores en todos los campos.

Sé cómo puedo verificar si el control CKEditor tiene algo, pero podrían ser etiquetas HTML "vacías" sin texto.

¿Cómo verifico el texto?

Servidor Estoy usando algo como el ajuste de PHP (strip_tags ($ content)), así que me gustaría tener el mismo en JavaScript.

También se puede usar una solución que use jQuery.

Answer 1

Esto funcionará:

$("#editorContainer iframe").contents().find("body").text(); 

que contendrá sólo el texto, y ninguna de las etiquetas HTML.

ACTUALIZACIÓN

Definitivamente funciona en el CKEditor demo page. Utilizar Firefox y Firebug, vaya a la consola de Firebug, y escribe:

$("#demoInside iframe").contents().find("body").text(); 

La consola imprimir el texto en el editor, sin etiquetas HTML. Asegúrese de tener el selector correcto en su aplicación particular. Puede probar su selector así:

$("#demoInside iframe").contents().find("body").length; 

Eso debería ser igual a 1. Si es 0, su selector está equivocado.

ACTUALIZACIÓN 2

Una vez más, mi código es todavía correcta, y que todavía funciona en esa página. Solo necesitas el selector correcto. En la página a la que se ha vinculado, es <span> con id cke_editor1. Esa página en particular no utiliza jQuery, por lo que requiere un trabajo adicional para probar que esta muestra funciona. Instale FireQuery, "jqueryify" la página, y luego haga esto en la consola Firebug (tenga en cuenta que debe usar jQuery y no $. Así es como funciona FireQuery).

jQuery("#cke_editor1 iframe").contents().find("body").text(); 

En resumen, asegúrese de tener el selector hacia la derecha para llegar a su marco flotante. Si crea su CKEditor desde <div> o <textarea> no es importante. Siempre que pueda seleccionar el que CKEditor inyecta en el DOM, puede usar .contents().find("body").text() para obtener el texto de ese iframe. ¿Has probado tu selector jquery para ver si .length == 1?

Answer 2

Utilizamos prototipo, con la biblioteca y la siguiente adición:

Element.addMethods({ 
    getInnerText: function(element) { 
    element = $(element); 
    return element.innerText && !window.opera ? element.innerText 
     : element.innerHTML.stripScripts().unescapeHTML().replace(/[\n\r\s]+/g, ' '); 
    } 
}); 

(Gracias a Tobie Langel)

pude usar la siguiente función para determinar si cualquier texto real estaba dentro de CKEditor:

function editorEmpty(instanceName){ 

    var ele = (new Element('div')).update(CKEDITOR.instances[instanceName].getData()); 

    return (ele.getInnerText() == '' || innerText.search(/^( )+$/i) == 0); 
} 

nota la prueba de   también - a menudo cuando el editor aparece vacío, en realidad contiene algo g como: <p>&nbsp;</p>.

Answer 3

CKeditor tiene su propio construido en función de la recuperación de datos en un editor de texto:

function CheckForm(theForm) 
{ 
    textbox_data = CKEDITOR.instances.mytextbox.getData(); 
    if (textbox_data==='') 
    { 
     alert('please enter a comment'); 
    } 
} 

Documentation

Answer 4

Puede utilizar el siguiente fragmento de comprobar si el CKEditor tiene algo de texto.

var _contents = CKEDITOR.instances.editor1.document.getBody().getText(); 
if (_contents == '') { 
    alert('Please provide the contents.') ; 
}