2010-12-09 34 views
4

Lorsque j'essaie de cloner une zone de texte à l'aide de cloneNote (true), la zone de texte clonée n'est pas modifiable. Est-ce que quelqu'un sait comment résoudre le problème? Les exemples de codes s'affichent comme suit:comment obtenir tinyMCE modifiable pour une zone de texte clonée par la fonction cloneNode (true)

<html> 
<head> 
<script type="text/javascript" src="/javascripts/tiny_mce/tiny_mce.js"></script> 
<script type="text/javascript"> 
tinyMCE.init({ 
     theme : "advanced", 
     mode : "textareas", 
}); 
</script> 

<script type="text/javascript"> 

testclonenode = { 

    addAbove : function (element) { 
     var rowEl = element.parentNode.parentNode.parentNode; 
     var rowElClone = rowEl.cloneNode(true); 

     rowEl.parentNode.insertBefore(rowElClone, rowEl); 

     return false; 
    } 
}; 
</script> 
</head> 

<body> 
<table> 
<tr><td> 
    <textarea name="content" style="width:100%">this is a test </textarea> 
<p> <button onclick='return testclonenode.addAbove.call(testclonenode, this);'> Add above </button> 
</td></tr> 
</table> 
</body></html> 

Répondre

3

Cela ne fonctionne pas de cette façon. En outre, il est impossible de déplacer un éditeur tinymce en utilisant la manipulation dom.

Les états wiki de TinyMCE les éléments suivants:

mceAddControl

Transforme le textarea spécifié ou div dans une instance d'éditeur ayant la ID spécifié.

Exemple:

tinyMCE.execCommand('mceAddControl',false,'mydiv'); 

Ainsi, lorsque vous cloner un textarea il y a un autre problème: vous aurez le même identifiant deux fois ce qui se traduira par des erreurs qui accèdent l'instance tinymce droit.

+0

merci, j'ai résolu mon problème – mark

+0

heureux d'avoir été en mesure d'aider (s'il vous plaît envisager de voter pour ma réponse et de l'accepter) – Thariama

1

J'ai eu que cela fonctionne en utilisant un ID qui est incrémenté à chaque fois que ma fonction de clone est déclenché, si

var insertslideID = 0; 
function slideclone() { 
    $('<div class="slides"><textarea name="newslide['+insertslideID+'][slide_desc]" id="mydiv'+insertslideID+'"></textarea></div>').insertAfter('div.slides:last'); 
    tinyMCE.execCommand('mceAddControl',false,'mydiv'+insertslideID); 
    insertslideID++; 
} 
$('input[name=addaslidebtn]').click(slideclone); 

semble fonctionner.

1

Un petit peu plus propre, je viens d'utiliser un numéro pour mon id - copy1 est le nom de mon bouton - j'ajoute le nouvel élément à la fin de mon conteneur.

var count = 0; 


$("#copy1").click(function(){ 
    var newId = count; 
    $("#first").clone().appendTo("#container").prop({ id: newId, }); 
    tinyMCE.execCommand('mceAddControl',false,newId); 
    count++; 
    }); 
0

je suis tombé sur un problème similaire, à l'exception de mes ID d'élément (pas seulement textareas) pourrait être quelque chose, et le même ID a toujours été deux fois comparaissent. Ce que j'ai fait est censé être horriblement inefficace, mais il n'y avait pas de perte de performance notable avec des dizaines d'éléments sur la page.

Fondamentalement, je retiré l'ID TinyMCE premier (utilise jQuery):

$(new_element).find('.mce-content-body').each(function() { 
    $(this).removeAttr('id'); 
}); 

Je réinitialisés TinyMCE pour tous les éléments pertinents.