Verwenden Sie "Aktualisiert WMD-Editor" in Textfelder geladen von AJAX-Forms

Question

Wir versuchen, Stackoverflow hervorragende WMD/Markdown-Editor (http://blog.stackoverflow.com/2009/01/updated-wmd-editor/, http://github.com/derobins/wmd/tree/master) auf einem Symfony-Projekt zu verwenden.

Dies funktioniert hervorragend auf Textareas ohne AJAX beteiligt. Aber wenn wir schließen müssen wmd.js zuerst, und dann später auf Interaktion mit dem Benutzer (zB „klicken auf den Link“) haben die TextArea- über AJAX geladen wir völlig WMD Arbeit machen scheitern, wird Firebug geben uns

elem is null 

addEvent()()wmd.js (Linie 110) 
setupEvents()()wmd.js (Linie 1790) 
init()()wmd.js (Linie 1970) 
previewManager()()wmd.js (Linie 1987) 
loadListener()()wmd.js (Linie 1763) 

[Break on this error] if (elem.attachEvent) { 

beim Laden der Seite (dh vor dem Laden des Textareals).

Symfony AJAX Loader scheint alles zwischen Tags zu eval(). Wir haben versucht, das ganze Skript direkt zwischen diese Tags einzufügen, wir haben versucht, dies und das zu umgehen, hatten aber keinen Erfolg mit verschiedenen Fehlern.

An diesem Punkt denken wir, dass wir das Skript in die normale Seite einfügen müssen und nach dem AJAX-Aufruf müssen wir WMD manuell initiieren - welche Funktionen müssen wir aufrufen? Sind wir völlig verrückt und müssen einen anderen Ansatz verfolgen?

Vielen Dank!

Answer 1

Drobins Gabel von Wmd auf github löst die AJAX-Probleme auch.

Answer 2

Sie können meine Version verwenden. Setzen Sie einfach den Konstruktoraufruf, die Konfigurationswerte und den Aufruf an die Methode start() in der Rückruffunktion, die die Ergebnisse behandelt, die Sie von der AJAX-Anforderung erhalten. My version of mooWMD.

Answer 3

Ich hatte das gleiche Problem und initialisiere WMD, sobald mein Textbereich der Seite asynchron hinzugefügt wurde.

Heres mein Code:

function loadTextEditor() 
{ 
    var instances = []; 

    if (!Attacklab || !Attacklab.wmd) { 
       alert("WMD hasn't finished loading!"); 
       return; 
      } 
    /***** build the preview manager *****/ 
    var textArea = document.getElementById('postcontent'); 
    var previewPane = document.getElementById('postPreview'); 

    var panes = {input:textArea, preview:previewPane, output:null}; 
    var previewManager = new Attacklab.wmd.previewManager(panes); 

    /***** build the editor and tell it to refresh the preview after commands *****/ 
    var editor = new Attacklab.wmd.editor(textArea,previewManager.refresh); 

    // save everything so we can destroy it all later 
    instances.push({ta:textarea, div:previewDiv, ed:editor, pm:previewManager}); 

}