Creating multiple wp_editer() text fields in for loop -- the text/visual switch only works for first editor

Question

Working on a plugin to handle woocommerce product tabs.

in the wp-admin edit product page I am loading in the WYSIWYG editors dynamically based on a db field called _tab_count. so if _tab_count is set to 2 -- load 2 editors, etc.

The problem I am experiencing, is that only the first editor has the option to edit as rich text, and the text/visual toggle is only working for the first editor.

the text/visual buttons show up in the other editors but, when clicked, they all toggle the first editor.

Also, the rich-text editor buttons only show up for the first editor. ( see screenshot )

Here is my php to load the editors, I have attempted to only paste the relevant pieces of code.

function benz_meta_box_markup($object) {
  wp_nonce_field(basename(__FILE__), "meta-box-nonce");
    global $post;
    $benz_tab_count = get_post_meta( $post->ID, '_tab_count', true );
    for ( $x = 0; $x < $benz_tab_count; $x++ ) {
      $y=$x+1;
      $benz_tab_content = get_post_meta( $post->ID, "_tabs_content_$y", true );
      if ( ! $benz_tab_content ) {
        $benz_tab_content = '';
       }
      $settings = array( 'textarea_name' => "benz-product-tabs-details_$y" );
      ?>
      <tr class="form-field">
        <th scope="row" valign="top"><label for="benz-product-tabs-details_<?php echo $y ;?>">Tab <?php echo $y ;?> Content: </label></th>
        <td>
          <?php wp_nonce_field( basename( __FILE__ ), "benz_product_tabs_details_nonce_$y" ); ?>
          <?php wp_editor( wp_kses_post( $benz_tab_content ), 'benz_tab_content', $settings ); ?>
        </td>
      </tr>
    <?php
  } // end for loop
} //custom_meta_box_markup

I have created this code - based on this post

however in the above post - this field was only being added once, and to a category (term) and not a product (post)

let me know if you have any input, thanks for reading.

Answer 1

https://codex.wordpress.org/Function_Reference/wp_editor

The second argument for the wp_editor() function is editor ID

In the above for loop - all of the editors had the same ID

Changing

<?php wp_editor( wp_kses_post( $benz_tab_content ), 'benz_tab_content', $settings ); ?>

to

<?php wp_editor( wp_kses_post( $benz_tab_content ), "benz_tab_content_$y", $settings ); ?>

allowed me to give each editor a unique ID -- per the counting variable.

The editors ( as many as needed ) are loading fine now.

Going to leave this up to help anyone else looking to dynamically create wp_editor() fields based on a counting loop