1

Caso

CkEditor no carga en Modales de los CRUD de Sonata

Pasos para reproducir

Tengo una entidad con un CRUD en el cual hay un CkEditor, dentro de esta, puedo añadir entidades relacionadas que también tienen un Ckeditor para alguno de sus campos.

El CkEditor de la entidad principal funciona correctamente, y el de la entidad anidada funciona la primera vez que lo abro, pero en las sucesivas no llega a cargar y solo veo un cuadro de texto plano.

Resultados esperados:

CkEditor funcionando correctamente en todas las modales.

Resultados del error

El CkEditor no carga la segunda vez que abres la entidad anidada

Entorno

Versión de PHP:

PHP 7.2.14 (cli) (built: Jan 11 2019 01:23:39) ( NTS )
Copyright (c) 1997-2018 The PHP Group
Zend Engine v3.2.0, Copyright (c) 1998-2018 Zend Technologies
    with Zend OPcache v7.2.14, Copyright (c) 1999-2018, by Zend Technologies

Paquetes de Sonata:

sonata-project/admin-bundle              3.45.1 The missing Symfony Admin Generator
sonata-project/block-bundle              3.15.0 Symfony SonataBlockBundle
sonata-project/cache                     2.0.1  Cache library
sonata-project/core-bundle               3.16.2 Symfony SonataCoreBundle
sonata-project/datagrid-bundle           2.5.0  Symfony SonataDatagridBundle
sonata-project/doctrine-extensions       1.2.0  Doctrine2 behavioral extensions
sonata-project/doctrine-orm-admin-bundle 3.8.3  Symfony Sonata / Integrate Doctrine ORM into the SonataAdminBundle
sonata-project/easy-extends-bundle       2.5.0  Symfony SonataEasyExtendsBundle
sonata-project/exporter                  2.0.1  Lightweight Exporter library
sonata-project/formatter-bundle          3.5.0  Symfony SonataFormatterBundle
sonata-project/media-bundle              3.19.1 Symfony SonataMediaBundle
sonata-project/user-bundle               4.3.0  Symfony SonataUserBundle

Paquetes de Symfony:

symfony/assetic-bundle     v2.8.2  Integrates Assetic into Symfony2
symfony/monolog-bundle     v3.1.2  Symfony MonologBundle
symfony/phpunit-bridge     v4.2.7  Symfony PHPUnit Bridge
symfony/polyfill-apcu      v1.11.0 Symfony polyfill backporting apcu_* functions to lower PHP versions
symfony/polyfill-ctype     v1.11.0 Symfony polyfill for ctype functions
symfony/polyfill-iconv     v1.11.0 Symfony polyfill for the Iconv extension
symfony/polyfill-intl-icu  v1.11.0 Symfony polyfill for intl's ICU-related data and classes
symfony/polyfill-intl-idn  v1.11.0 Symfony polyfill for intl's idn_to_ascii and idn_to_utf8 functions
symfony/polyfill-mbstring  v1.11.0 Symfony polyfill for the Mbstring extension
symfony/polyfill-php56     v1.11.0 Symfony polyfill backporting some PHP 5.6+ features to lower PHP versions
symfony/polyfill-php70     v1.11.0 Symfony polyfill backporting some PHP 7.0+ features to lower PHP versions
symfony/polyfill-php72     v1.11.0 Symfony polyfill backporting some PHP 7.2+ features to lower PHP versions
symfony/polyfill-util      v1.11.0 Symfony utilities for portability of PHP codes
symfony/security-acl       v3.0.2  Symfony Security Component - ACL (Access Control List)
symfony/swiftmailer-bundle v3.2.6  Symfony SwiftmailerBundle
symfony/symfony            v3.4.26 The Symfony PHP framework
symfony/var-dumper         v4.2.7  Symfony mechanism for exploring and dumping PHP variables

Error Consola de Chrome:

ckeditor.js:21 [CKEDITOR] Error code: editor-destroy-iframe.
(anonymous) @ ckeditor.js:21
p @ ckeditor.js:10
(anonymous) @ ckeditor.js:12
CKEDITOR.warn @ ckeditor.js:19
detach @ ckeditor.js:956
CKEDITOR.editor.editable @ ckeditor.js:400
destroy @ ckeditor.js:283
(anonymous) @ VM4698:12
dispatch @ jquery.js:4435
r.handle @ jquery.js:4121
trigger @ jquery.js:4350
(anonymous) @ jquery.js:4901
each @ jquery.js:374
each @ jquery.js:139
trigger @ jquery.js:4900
(anonymous) @ VM4698:49
j @ jquery.js:3099
add @ jquery.js:3145
n.fn.ready @ jquery.js:3378
(anonymous) @ VM4698:1
globalEval @ jquery.js:328
domManip @ jquery.js:5435
append @ jquery.js:5218
(anonymous) @ jquery.js:5333
n.access @ jquery.js:3491
html @ jquery.js:5300
success @ VM4688:139
j @ jquery.js:3099
fireWith @ jquery.js:3211
x @ jquery.js:8264
(anonymous) @ jquery.js:8605
load (async)
send @ jquery.js:8622
ajax @ jquery.js:8166
field_dialog_form_add_scdc125194a_reason @ VM4688:131
dispatch @ jquery.js:4435
r.handle @ jquery.js:4121
trigger @ jquery.js:4350
(anonymous) @ jquery.js:4901
each @ jquery.js:374
each @ jquery.js:139
trigger @ jquery.js:4900
start_field_dialog_form_add_scdc125194a_reason @ VM4688:263
onclick @ create:1
ckeditor.js:21 [CKEDITOR] For more information about this error go to https://ckeditor.com/docs/ckeditor4/latest/guide/dev_errors.html#editor-destroy-iframe
2
  • Buenas Krleza. Estás en SOes, lo cual significa que las preguntas han de ser en español. ¿Puedes traducir esta pregunta al español? Así evitarás que te la cierren y mas personas podrán ayudarte. Un saludo. el 25 abr. 2019 a las 14:00
  • ostras que despiste!
    – Krleza
    el 29 abr. 2019 a las 6:35

1 respuesta 1

0

En el DoctrineORMAdminBundle, El archivo doctrine-orm-admin-bundle/src/Resources/views/CRUD/edit_orm_many_association_script.html.twig tiene la siguiente función

    function initialize_popup_{{ id }}() {
        // initialize component
        if (!field_dialog_{{ id }}) {
            field_dialog_{{ id }}         = jQuery("#field_dialog_{{ id }}");
            field_dialog_content_{{ id }} = jQuery(".modal-body", "#field_dialog_{{ id }}");
            field_dialog_title_{{ id }}   = jQuery(".modal-title", "#field_dialog_{{ id }}");

            // move the dialog as a child of the root element, nested form breaks html ...
            jQuery(document.body).append(field_dialog_{{ id }});

            Admin.log('[{{ id }}|field_dialog] move dialog container as a document child');
        }
    }

Dentro hacemos el append bajo la condición de no exista la variable field_dialog_id, pero si abrimos dos modales anidadas, esa variable existe y no llegaremos a hacer el append, de forma que si modificamos la función sacando el append de la condición tendremos en Ckeditor funcionando en las modales anidadas.

    function initialize_popup_{{ id }}() {
        // initialize component
        if (!field_dialog_{{ id }}) {
            field_dialog_{{ id }}         = jQuery("#field_dialog_{{ id }}");
            field_dialog_content_{{ id }} = jQuery(".modal-body", "#field_dialog_{{ id }}");
            field_dialog_title_{{ id }}   = jQuery(".modal-title", "#field_dialog_{{ id }}");
        }

            // move the dialog as a child of the root element, nested form breaks html ...
            jQuery(document.body).append(field_dialog_{{ id }});

            Admin.log('[{{ id }}|field_dialog] move dialog container as a document child');
    }

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.