jQuery Clone Formularfeldgruppe füge wp_editor() -Funktion dem Textbereich hinzu

Question

In CPT metabox verwende ich wp_editor(). Der erste lädt über die PHP-Funktion. Wenn ich die Formularfelder jedoch über jQuery kloniere, wird kein wp_editor hinzugefügt, sondern ein einfacher Textbereich.

So here Ich fand eine script, die wp_editor über Javascript lädt. Wenn ich jedoch versuchte, die Formularfelder zu kopieren/anhängen, lädt es nicht den wp_editor, sondern den einfachen Textbereich.

Ich glaube, dass DOM lädt nicht die wp_editor() js Funktion. Kann mir jemand sagen, wie ich wp_editor für geklonte Felder laden kann?

jQuery

// Just to cross check. This is loading wp_editor on page load 
jQuery('.cn-wp-editor').wp_editor(); 

// wp_localization 
var title = cn_fields.title; 
var teditor = cn_fields.editor; 

// adding incremental id 
var i = 1; 

// clone fields 
$('#add_item').on('click', function() { 
    i++; 
    $('#fieldgroup').append('<div class="formgroup"><div class="card-meta-box"><label for="card_title" class="card-field-label">Item Title</label><input type="text" name="' + title + '[]" id="' + title + i +'"></div><div class="card-meta-box"><textarea name="' + teditor + '[]" id="' + teditor + i +'" class="cn-wp-editor"></textarea></div><button class="remove">x</button></div><!-- formgroup -->'); 
    return false; //prevent form submission 
}); 

// remove fields 
$('#fieldgroup').on('click', '.remove', function() { 
    $(this).parent().remove(); 
    return false; //prevent form submission 
    i--; 
}); 

Answer 1

Sie müssen wp_editor() zu neu initialisiert, wenn Sie duplizieren/kopieren das Feld. Ihr Code funktioniert nicht als das kopierte/erstellte Feld in nicht in DOM beim Laden der Seite, so wp_editor() wurde nicht an diese neuen Feld (s) angefügt.

Überprüfen Sie diesen Code:

$('#add_item').on('click', function() { 
    i++; 
    $('#fieldgroup').append('<div class="formgroup"><div class="card-meta-box"><label for="card_title" class="card-field-label">Item Title</label><input type="text" name="' + title + '[]" id="' + title + i + '"></div><div class="card-meta-box"><textarea name="' + teditor + '[]" id="' + teditor + i + '" class="cn-wp-editor"></textarea></div><button class="remove">x</button></div><!-- formgroup -->'); 
    $('#' + title + i).wp_editor(); //<------ add this line 
    return false; //prevent form submission 
}); 

hoffe, das hilft!