[HaBo]

she3p · 20.07.11, 19:49

Guten Abend!

Im Moment arbeite ich für eine Vereinsverwaltungssoftware an einer Implementation eines GUIs für die Erstellung von Druckvorlagen wie Serienbriefe oder aber auch Rechnungen. Dabei werden auf einer Seite (pages) droppable sections (zones) verteilt, welche dafür da sind dynamische und statische Elemente (elements) zu platzieren.

Als Beispiel für elements zu nennen wäre Text, Bilder, dynamische Rows (für Rechnungsposten) etc..

Das editieren eines solchen elements (in diesem Fall Text) ist mithilfe eines jQueryUI-Dialogs umgesetzt. Das heisst, in einem solchen Dialog wird ein FCKeditor gestartet, mithilfe dessen der Text angepasst werden soll.

Soweit so gut, funktioniert auch ohne Probleme. Es failt erst dann, wenn ich versuche zum zweiten Mal eine Instanz des FCKeditors zu öffnen (das heisst, nach einem erneuten öffnen des Editierdialogs). Irrelevant ob ich genau den gleichen Dialog, oder einen eines anderen elements öffne.

Code:

p is null - ckeditor.js (line 126)

Die weiten des Internets wissen leider nicht allzuviel darüber. Die einzige Möglichkeit habe ich hier gefunden. Wenn ich allerdings umsetze, was er schreibt, so führt das zu einer neuen Fehlermeldung.

Code:

L is null - ckeditor.js (line 97)

Weiter hab ich mich noch nicht gegraben. Auch wenn ich - wie er in seinem Post erwähnte - den Inhalt vor dem initialisieren des Editors einfüge > selbes Resultat.

Nun zur Implementation:

Code:

[...]
var editor = $('<textarea class="ckeditor" />');
var id = 'ckedit_' + ctx.idx;

editor.attr('id', id);
editor.val(ctx.content);

// append textarea with fckeditor enabled
dlg.append(editor);

var instance = CKEDITOR.instances[id];
if(instance)
{
    CKEDITOR.remove(instance);
}

CKEDITOR.replace(editor.get(0), cksettings);
[...]

Ich prüfe also in jedem Fall auf das Vorhandensein derselben Instanz. Tests haben allerdings gezeigt, dass sie nicht mehr existiert, wenn ich den Editor zum zweiten Mal starte. Aber sicher ist sicher.

Das schliessen des Dialogs habe ich wie folgt gemacht

Code:

[...]
this.dlg.dialog(
{
    modal: true,
    width: 800,
    height: 500,
    buttons:
    {
        "Ok": function()
        {
            // hokay!
        },
   
        "Close": function()
        {
            $(CKEDITOR.instances).each(function(idx, editor)
            {
                // destroy editor and remove it from memory
                for(var key in editor)
                {
                    editor[key].destroy();
                }
            });
       
            $(this).dialog('close');
            $(this).dialog('destroy');
        }
    }
});
[...]

Ich destroy()'e also nicht nur alle Editorinstanzen, welche zu diesem Zeitpunkt existieren, ich schliesse und destroy()'e auch den gesamten Dialog. Nur damit niemand auf die Idee kommen könnte, es hätte was mit einem gecachten Dialog im DOM zu tun.
Des weiteren wird die erste Routine immer aufgerufen, wenn ein Dialog geöffnet werden soll, das heisst, der Editor wird immer neu erstellt. Nun es wird wohl einen Grund haben, dass es erst beim zweiten Mal nicht mehr klappt, aber ich steh gerade auf dem Schlauch.
Das einzige was mir noch einfällt, wäre, dass ich die Editorinstanz unvollständig schliesse, oder dass der CKEditor von sich aus Probleme macht.

Zur Veranschaulichung hab ich das Projekt mal auf meinen Server gepappt:

GPO

Und einen kleinen Screenshot hinzugefügt, auf dem ersichtlich ist, welche Buttons gedrückt werden sollen.

Falls sich jemand die Sources anschaut: Die Dialoge sind in etwa mit einem FactoryPattern implementiert, aber das dürfte nicht die Quelle des Problems sein. Die entscheidenden Files zum Problem dürften zusammengefasst diese sein:

js/jquery.gpo.def.EditDialog.js
js/jquery.gpo.def.EditDialog.Text.js
js/jquery.gpo.def.EditDialogAbstract.js

b4ck · 12.08.11, 14:27

in diesem thread gibt es einige antworten auf ähnliche probleme: javascript - CKEditor instance already exists - Stack Overflow

zB. wird vorgeschlagen als selektor NICHT die klasse "ckeditor" zu nehmen da es da zu problemen mit jquery internas kommen kann.

Also in deinem Fall:

statt:

Code:

class="ckeditor"

einfach

Code:

 class="gpo_ckeditor"

verwenden.

Anzeige

- Anzeige -

20.07.11, 19:49	#1 (permalink)
she3p Registriert seit: 07.05.07 Likes: 19	CKEditor / jQueryUI - Error beim zweiten Start des Editors Anzeige Guten Abend! Im Moment arbeite ich für eine Vereinsverwaltungssoftware an einer Implementation eines GUIs für die Erstellung von Druckvorlagen wie Serienbriefe oder aber auch Rechnungen. Dabei werden auf einer Seite (pages) droppable sections (zones) verteilt, welche dafür da sind dynamische und statische Elemente (elements) zu platzieren. Als Beispiel für elements zu nennen wäre Text, Bilder, dynamische Rows (für Rechnungsposten) etc.. Das editieren eines solchen elements (in diesem Fall Text) ist mithilfe eines jQueryUI-Dialogs umgesetzt. Das heisst, in einem solchen Dialog wird ein FCKeditor gestartet, mithilfe dessen der Text angepasst werden soll. Soweit so gut, funktioniert auch ohne Probleme. Es failt erst dann, wenn ich versuche zum zweiten Mal eine Instanz des FCKeditors zu öffnen (das heisst, nach einem erneuten öffnen des Editierdialogs). Irrelevant ob ich genau den gleichen Dialog, oder einen eines anderen elements öffne. Code: p is null - ckeditor.js (line 126) Die weiten des Internets wissen leider nicht allzuviel darüber. Die einzige Möglichkeit habe ich hier gefunden. Wenn ich allerdings umsetze, was er schreibt, so führt das zu einer neuen Fehlermeldung. Code: L is null - ckeditor.js (line 97) Weiter hab ich mich noch nicht gegraben. Auch wenn ich - wie er in seinem Post erwähnte - den Inhalt vor dem initialisieren des Editors einfüge > selbes Resultat. Nun zur Implementation: Code: [...] var editor = $('<textarea class="ckeditor" />'); var id = 'ckedit_' + ctx.idx; editor.attr('id', id); editor.val(ctx.content); // append textarea with fckeditor enabled dlg.append(editor); var instance = CKEDITOR.instances[id]; if(instance) { CKEDITOR.remove(instance); } CKEDITOR.replace(editor.get(0), cksettings); [...] Ich prüfe also in jedem Fall auf das Vorhandensein derselben Instanz. Tests haben allerdings gezeigt, dass sie nicht mehr existiert, wenn ich den Editor zum zweiten Mal starte. Aber sicher ist sicher. Das schliessen des Dialogs habe ich wie folgt gemacht Code: [...] this.dlg.dialog( { modal: true, width: 800, height: 500, buttons: { "Ok": function() { // hokay! }, "Close": function() { $(CKEDITOR.instances).each(function(idx, editor) { // destroy editor and remove it from memory for(var key in editor) { editor[key].destroy(); } }); $(this).dialog('close'); $(this).dialog('destroy'); } } }); [...] Ich destroy()'e also nicht nur alle Editorinstanzen, welche zu diesem Zeitpunkt existieren, ich schliesse und destroy()'e auch den gesamten Dialog. Nur damit niemand auf die Idee kommen könnte, es hätte was mit einem gecachten Dialog im DOM zu tun. Des weiteren wird die erste Routine immer aufgerufen, wenn ein Dialog geöffnet werden soll, das heisst, der Editor wird immer neu erstellt. Nun es wird wohl einen Grund haben, dass es erst beim zweiten Mal nicht mehr klappt, aber ich steh gerade auf dem Schlauch. Das einzige was mir noch einfällt, wäre, dass ich die Editorinstanz unvollständig schliesse, oder dass der CKEditor von sich aus Probleme macht. Zur Veranschaulichung hab ich das Projekt mal auf meinen Server gepappt: GPO Und einen kleinen Screenshot hinzugefügt, auf dem ersichtlich ist, welche Buttons gedrückt werden sollen. Falls sich jemand die Sources anschaut: Die Dialoge sind in etwa mit einem FactoryPattern implementiert, aber das dürfte nicht die Quelle des Problems sein. Die entscheidenden Files zum Problem dürften zusammengefasst diese sein: js/jquery.gpo.def.EditDialog.js js/jquery.gpo.def.EditDialog.Text.js js/jquery.gpo.def.EditDialogAbstract.js __________________ #Twitter Anteater Bugtracker (in progress..)

12.08.11, 14:27	#2 (permalink)
b4ck Registriert seit: 13.02.06 Likes: 1	in diesem thread gibt es einige antworten auf ähnliche probleme: javascript - CKEditor instance already exists - Stack Overflow zB. wird vorgeschlagen als selektor NICHT die klasse "ckeditor" zu nehmen da es da zu problemen mit jquery internas kommen kann. Also in deinem Fall: statt: Code: class="ckeditor" einfach Code: class="gpo_ckeditor" verwenden.

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln

[HaBo]

CKEditor / jQueryUI - Error beim zweiten Start des Editors