tinymce text area is not working in js

[ad_1]

I’m trying to add something like the repeater field in ACF, but it is done in custom php, it adds a custom field to my post.

​

it supposed to add a name and a text area each time you press a button with an ability to remove any selected row (name and a text area) you have added.

​

when you add a post there is already an empty text area that is added by using this php code

<?php
$content = ”; // initialize the content variable
$settings = array(
‘editor\_height’ => 300,
‘teeny’ => false,
‘textarea\_name’ => ‘paragraph\[\]’,
‘quicktags’ => true,
);
$editor\_id = ‘editorID-‘ . time();
echo wp\_editor($content, $editor\_id, $settings);
?>

&#x200B;

and when you click at add another extra row (that is done in js), another row appears that has the fields(text area, name), and this is the js code for adding it

&#x200B;

var settings = {
tinymce: {
plugins: ‘lists link fullscreen code’,
toolbar1: ‘styleselect | bold italic underline | bullist numlist | blockquote | alignleft aligncenter alignright | link | fullscreen’,
toolbar2: ‘formatselect | undo redo | code’,
menubar: false,
wpautop: true,
quicktags: true,
mediaButtons: true
},
quicktags: true,
mediaButtons: true
};

&#x200B;

var newEditorId = ‘editorID-‘ + new Date().getTime();
var newEditorTextarea = ‘<textarea id=”‘ + newEditorId + ‘” name=”paragraph\[\]”></textarea>’;

wp.editor.initialize(newEditorId, settings);
I then append it to the already existing html table.

the logic is correct but my problem happens when I go to the update page of that post, the tinymce text area that was added in js code loses its toolbar, but the one that has been added in php is working fine.

any help would be appreciated.

[ad_2]