javascript - getdata - ckeditor tutorial español

Obtener formato HTML de CKEditor

Question

Estoy usando CKEditor en mi aplicación web, y no sé cómo obtener los contenidos del editor con formato HTML.

var objEditor = CKEDITOR.instances["sectionTextArea"];
var q = objEditor.getData();

Esto me dará el texto ingresado en CKEditor, sin ninguna marca.

Sin embargo,

var q = objEditor.getHTML();

devolverá un valor nulo. ¿Qué estoy haciendo mal?

Answer 1

Actualice ckeditor config.js con la siguiente línea

config.fullPage = true;

Esto devolverá el html completo cuando solicite getData ();

Answer 2

Esto funcionó para mí:

CKEDITOR.instances["id"].getData()

Answer 3

Estoy usando el complemento de vista previa para obtener el contenido HTML completo, espero que ayude.

CKEDITOR.getFullHTMLContent = function(editor){
 var cnt = "";
 editor.once(''contentPreview'', function(e){
  cnt = e.data.dataValue;
  return false;
 });
 editor.execCommand(''preview'');
 
 return cnt;
}

Answer 4

Me doy cuenta de que esto es antiguo, pero tuve problemas para encontrar una respuesta que tuviera sentido y que devolviera el HTML real, incluidas las imágenes. Si su instancia de ckeditor se adjunta a un área de texto, puede obtener el valor del área de texto para obtener el HTML.

Por ejemplo, si estás usando jQuery:

$(''#my_editor'').val()

No hay necesidad de ir a cavar a través de la API.

Answer 5

Para obtener htmlData del editor, debe usar el siguiente fragmento de código:

var htmldata = CKEDITOR.instances.Editor.document.getBody().getHtml();

Si esta solución no funciona, verifique si tiene los complementos de BBCode desinstalados.

Answer 6

Para usuarios de Java ...

Después de presionar el botón enviar, la solicitud pasa por el método HTTP Post. Esta solicitud de publicación también contiene el html formateado en el parámetro nombrado usando el atributo name del área de texto.

Entonces, si tu textarea es algo así como ...

<form method="post" action="createPDF.do"> <textarea name="editor1" id="editor1"/>  <input type="submit"/> </form>

Luego, después de presionar el botón enviar, puede obtener el html formateado en su servlet / controlador de la siguiente manera:

String htmlContent = request.getParameter("editor1");

También puede pasar esta variable que contiene el formato html (''htmlContent'') a ITEXT (o algunos otros convertidores de pdf) para crear el pdf ...

Answer 7

Prueba esto:

CKEDITOR.instances.YOUREDITOR.element.getHtml();

con CKEDITOR.instances.YOUREDITOR.element selecciona un elemento DOM y si usa CKEDITOR.instances.YOUREDITOR.element.getHtml (); Usted puede obtener todo el HTML del elemento editor.

Answer 8

Si tiene dos CKEditor , puede usar el siguiente código:

HTML

<textarea name="editor1"></textarea>
<textarea name="editor2"></textarea>

JS

CKEDITOR.replace( ''editor1'' );
CKEDITOR.replace( ''editor2'' );

var objEditor1 = CKEDITOR.instances["editor1"];
alert(objEditor1.getData()); // get html data

var objEditor2 = CKEDITOR.instances["editor2"];
alert(objEditor2.getData()); // get html data

Demo en línea (jsfiddle)

Answer 9

Solo para saber que el método correcto para esto es getData() no me ayudó. No sabía cómo usarlo en el objeto CKEditor. y CKEDITOR.getData() no funciona.

así es como se getData() en el objeto CKEDITOR:

CKEDITOR.instances.my_editor.getData()

... donde my_editor es el ID de tu área de texto utilizada para CKEditor.

Lo contrario de esto es setData() :

CKEDITOR.instances.my_editor.setData("<p>My Text</p>");

Answer 10

getHTML no es un método de un objeto CKEditor, por lo que en lugar de nulo debería tener un error de javascript.

El método definido por la api es getData() si eso no funciona, entonces tienes algún otro problema en tu código, intenta usar una alerta para verificar el contenido en ese momento.