2015-09-28 13 views
8

Ich habe ein TinyMCE-Plugin erstellt und benötigen die Listbox-Elemente, um HTML anzuzeigen. Das ist meine Plugin:TinyMCE Rendern Listbox Elemente als HTML

editor.addButton('icons', { 
    title: 'Foo', 
    text: 'Foo', 
    type: 'button', 
    onclick: function() { 
    editor.windowManager.open({ 
     title: 'Foo', 
     width: 300, 
     height: 200, 
     body: [{ 
     type: 'listbox', 
     label: 'Foo', 
     name: 'foo', 
     values: [{ 
      title: '<em>Foo</em>', // <-- Mark save. Render as html. 
      value: 1 
     }], 
     }], 
    }); 
    } 
}); 

Siehe auch die Geige: http://jsfiddle.net/allcaps/vqctac3d/

Aber die Ausgabe wie folgt aussieht:

enter image description here

Erwartet:

enter image description here

Wie kann Ich markiere Der Titel der Listenoption wird gespeichert, damit der Inhalt als HTML wiedergegeben wird.

+0

Ich denke, mein Vokabular ist beschränkt, um passende Suchphrasen zu denken ... Also sind alle Hinweise willkommen. – allcaps

+0

Warum verwenden Sie CSS nicht zum Formatieren des Listentitels und der Listenelemente? – Thariama

+0

Wie wähle ich diese Listenelemente aus? Ich kann keine Klasse oder ID festlegen. Die Auswahl nach Index funktioniert nicht mit dynamischen Inhalten. – allcaps

Antwort

2

Da niemand diese Frage beantwortet hat, werde ich die vorgeschlagene Lösung/Workaround aus dem Kommentar in eine Antwort einfügen.

Eigentlich ist es nicht möglich, HTML-Code mit dem ynymce Weg der Listbox Erstellung einzufügen. Aber es ist möglich, Listboxen mit CSS zu stylen.

Aufgrund der Tatsache, dass Listenfelder und andere tinymce UI-Elemente dynamisch gerendert werden, kann es schwierig sein, die korrekten html dom-Elemente zu adressieren.

Um dies zu umgehen, können Sie das Listbox-HTML nach dem Erstellen der Listbox austauschen. Dies ist möglich, wenn die Reihenfolge bekannt ist (und das ist fast so).