Come verificare se CKEditor contiene del testo?

Question

Ho un modulo HTML con alcuni campi. Uno di questi è un'area di testo gestita da CKEditor.

Quando l'utente desidera inviare il modulo, voglio verificare se ha inserito valori in tutti i campi.

So come posso controllare se il controllo CKEditor ha qualcosa in esso, ma potrebbe essere tag HTML "vuoti" senza testo.

Come controllo il testo?

Lato server Sto usando qualcosa come il trim di PHP (strip_tags ($ content)), quindi mi piacerebbe avere lo stesso in JavaScript.

Una soluzione che utilizza jQuery sarebbe anche utilizzabile.

Answer 1

Ciò funzionerà:

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

che conterrà solo il testo, e nessuno dei tag html.

UPDATE

Funziona decisamente in CKEditor demo page. Utilizzare Firefox e Firebug, andare alla console Firebug, e digitare:

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

La console stampare il testo nell'editor, senza tag HTML. Assicurati di avere il selettore corretto nella tua particolare applicazione. Puoi testare il tuo selettore in questo modo:

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

Che dovrebbe essere uguale a 1. Se è 0, il tuo selettore è sbagliato.

UPDATE 2

Ancora una volta, il mio codice è ancora corretto, e funziona ancora in quella pagina. Hai solo bisogno del selezionatore giusto. Nella pagina a cui sei collegato, è un <span> con ID cke_editor1. Quella particolare pagina non fa uso di jQuery, quindi richiede del lavoro aggiuntivo per dimostrare che questo esempio funziona. Installa FireQuery, "jqueryify" la pagina, e poi fai questo nella console di Firebug (nota che devi usare jQuery e non $. Ecco come funziona FireQuery).

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

Insomma, assicuratevi di avere il diritto di selezione per raggiungere il vostro iframe. Se crei CKEditor da o <textarea> non è importante. Finché è possibile selezionare che CKEditor inietta nel DOM, è possibile utilizzare .contents().find("body").text() per ottenere il testo di tale iframe. Hai provato il tuo selettore jquery per vedere se .length == 1?

Answer 2

Usiamo prototipo, con quella biblioteca e la seguente aggiunta:

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

(Grazie a Tobie Langel)

ero in grado di utilizzare la seguente funzione per determinare se qualsiasi testo effettivo era dentro CKEditor:

function editorEmpty(instanceName){ 

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

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

Nota il test per  , come pure - spesso quando l'editor appare vuota, in realtà contiene somethin g like: <p>&nbsp;</p>.

Answer 3

CKEditor ha una sua funzione integrata per il recupero dei dati in un editor di testo:

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

Documentation

Answer 4

È possibile utilizzare il seguente frammento per verificare se il ckeditor ha una parte di testo.

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