web-dev-qa-db-fra.com

setContenu d'une zone de texte avec tinyMCE

J'ai quelques textareas et tous sont avec tinyMCE.

Je voudrais définir le contenu de la zone de texte spécifique, mais je ne trouve pas comment.

J'ai essayé ceci:

 tinyMCE.get('title').setContent(selected_article_title);

voici mon texte:

<textarea style="width: 95%;" name="Title"  id="title"></textarea>

Et voici mon initiateur tinyMCE:

tinyMCE.init({
// General options
mode : "specific_textareas",
theme : "advanced",
width: "100%",
plugins : "pagebreak,paste,fullscreen,visualchars",

// Theme options
theme_advanced_buttons1 : "code,|,bold,italic,underline,|,sub,sup,|,charmap,|,fullscreen,|,bullist,numlist,|,pasteword",
theme_advanced_buttons2 :"",
theme_advanced_buttons3 :"",
theme_advanced_buttons4 :"",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_statusbar_location : "bottom",
valid_elements : "i,sub,sup",
invalid_elements : "p, script",
editor_deselector : "mceOthers"
});

Je ne sais pas pourquoi cela ne fonctionne pas, j'utilise l'exemple du site Web tinyMCE http://www.tinymce.com/wiki.php/API3:method.tinymce.Editor.setContent

javascripttinymcetextarea
11
Miloš

J'ai la solution (merci à Thariama qui me donne des éléments)

Pour définir le contenu d'une zone de texte à l'aide de tinyMCE, nous devons renseigner la zone de texte avant d'initier tinyMCE. En outre, la réponse est la suivante:

  1. Créez la zone de texte: 

    <textarea style="width: 95%;" name="Title"  id="title"></textarea>

  2. Définissez le contenu de la zone de texte:

    $('#title').html(selected_article_title);

  3. Initiez le tinyMCE:

    tinyMCE.init({
// General options
mode : "specific_textareas",
theme : "advanced",
width: "100%",
plugins : "pagebreak,paste,fullscreen,visualchars",

// Theme options
theme_advanced_buttons1 : "code,|,bold,italic,underline,|,sub,sup,|,charmap,|,fullscreen,|,bullist,numlist,|,pasteword",
theme_advanced_buttons2 :"",
theme_advanced_buttons3 :"",
theme_advanced_buttons4 :"",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_statusbar_location : "bottom",
valid_elements : "i,sub,sup",
invalid_elements : "p, script",
editor_deselector : "mceOthers"
});

Et c'est fait! Prendre plaisir.

12
Miloš

Pour tinymce version 4, 

tinymce.get('title').setContent(selected_article_title);

fonctionne parfaitement - même après l’initialisation de l’éditeur.

10
Tom

Je pense que cela résoudra votre problème

cela fonctionne très bien pour TinyMCE v: 4 .. 

// Sets the HTML contents of the activeEditor editor
tinyMCE.activeEditor.setContent('<span>some</span> html');

// Sets the raw contents of the activeEditor editor
tinyMCE.activeEditor.setContent('<span>some</span> html', {format : 'raw'});

// Sets the content of a specific editor (my_editor in this example)
tinyMCE.get('my_editor').setContent(data);

// Sets the bbcode contents of the activeEditor editor if the bbcode plugin was added
tinyMCE.activeEditor.setContent('[b]some[/b] html', {format : 'bbcode'});

le lien pour le code est TinyMCE setContent

9
Ryan Monreal

En utilisant cette

tinyMCE.get('title').setContent(selected_article_title);

ne fonctionnera pas. Cela définira le contenu de votre éditeur.

Pour définir l’élément HTML source de l'éditeur (la zone de texte), vous devez le définir directement à l'aide de

$('#title').html(selected_article_title);

Vous devez savoir que votre éditeur n'est pas le même que textarea!

1
Thariama
$('#title').html(selected_article_title);

Assurez-vous que selected_article_title ne contient pas de balises HTML.

0
Moses Kirathe

Ce qui suit fonctionne avec tinymce version 4 et ne montre pas l’éditeur en tant que zone de texte lorsqu’il est déplacé:

function initializeEditors() {
    var editorContent = {};
    $("#photo-list").sortable({
        start: function (e, ui) {
            $('.attachment-info').each(function () {
                var id = $(this).attr('id');
                editorContent[id] = tinyMCE.get(id).getContent();
            });
        },
        stop: function (e, ui) {
            $('.attachment-info').each(function () {
                var id = $(this).attr('id');
                tinymce.execCommand('mceRemoveEditor', false, id);
                tinymce.execCommand('mceAddEditor', true, id);
                tinyMCE.get(id).setContent(editorContent[id]);
            });
        }
    });
}
0
Shane McQuillan

Si vous définissez un contenu qui contient mso tags (un contenu HTML généré à partir d'Outlook 2013, contenant par exemple une liste numérotée), vous perdez les éléments de la liste. Définir avec tinymce.activeEditor.setContent (foo) ou d 'abord définir le contenu de textarea puis initialiser tinymce donne le même résultat, nous ne pouvons pas voir les éléments de liste correctement, ils sont alignés à gauche. Mais si nous définissons avec setContent(foo, { format:'raw' }), nous verrons correctement les éléments de la liste. Pourquoi?

0
benchpresser