• Hello,

    I’m working on a plugin that need to use the text editor in some modal box. I am using backbone.

    When backbone renders the view in which the text editor is included, it doesn’t work. The tabs don’t work and the buttons doesn’t appear.

    Example:

    class Modal {
    
      public function __construct( ) {
        if ( is_admin() ) {
          add_action( 'admin_footer', [ $this, '_render_template' ] );
          add_action( 'admin_enqueue_scripts', [ $this, '_admin_enqueue' ] );
        }
      }
    
      public function _render_template() {
        echo '<script type="text/template" id="tmpl-modal">';
          wp_editor( 'Text...', 'modal-box-editor' );
        echo '</script>';
      }
    
      public function _admin_enqueue( $hook ) {
        if ( 'post.php' != $hook && 'post-new.php' != $hook ) return;
        wp_enqueue_script( 'modal-box-script', get_template_directory_uri() . '/modal-box-script.js', [ 'jquery', 'backbone', 'underscore' ], null, true );
      }
    }
    
    $Modal = new Modal();

    Javascript:

    jQuery(document).ready(function($) {
    
      ModalView = Backbone.View.extend({
        tagName : 'div',
        template : _.template( $( '#tmpl-modal' ).html() ),
        $parent : $( 'body' ),
    
        initialize : function() {
          this.render();
        },
        render : function() {
          this.$el.html( this.template() );
          this.$parent.append( this.el );
          return this;
        },
      });
      var ModalBox = new ModalView();
    });

    Can someone help me?

    Thank You

The topic ‘wp_editor modalbox width backbone’ is closed to new replies.