wpeditor issue – shows both mode and not able to focus/edit during visual mode

I am trying to integrate wpeditor to a textarea using the code below. It brings the TinyMCE editor but if the user leaves the page on visual mode and tries to edit the same again, the visual mode doesn’t work. It doesn’t allow to focus into the content area in visual mode and it shows a blank screen.

Both mode are displayed stacked upon each other

enter image description here

    global $post;

    $result = wp_editor(
        stripslashes( html_entity_decode( $post->$column_name ) ),
        $field_name,
        array (
            'textarea_rows' => 25,
            'media_buttons' => FALSE,
            'teeny'         => TRUE,
            'tinymce'       => TRUE,
            'wpautop'       => TRUE,
        )
    );

    return $result;

How to fix the above fix ?

Please note that I am trying to display this on post quick edit screen. Even though I am able to display the editor, it creates problem when an user is editing on visual mode and leaves the page, next when comes again by clicking quick edit again, it shows a blank screen where the mouse can’t be focused.

1 Answer
1

There are a few ways you can go about adding a wpeditor to text areas.

  1. If you have the id value of the textbox you can use this JavaScript command to add the tinyMCE buttons to it dynamically.

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

  1. In your functions.php, add this code:

add_action( 'edit_page_form', 'mytextarea_for_page' );
function mytextarea_for_page() {
wp_editor( ' ', 'the_xyz' );
}

Replace the_xyz with the name of the textarea. The above code is for Add New PAGE. The below code is for the Add New POST:

add_action( 'edit_form_advanced', 'mytextarea_for_post' );
function mytextarea_for_post() {
wp_editor( ' ', 'the_xyz' );
}

In both cases, replace the_xyz with the name attribute of the textarea.

There are many more different ways to do this at http://wpquestions.com/question/showChrono/id/7818

Leave a Comment