Problem with TinyMCE Buttons Since 3.5 WordPress

• SOLVED

I have a plugin which I created and part of the plugin adds a button to the TinyMCE editor which popups up a window and users select a bit text and then it inserts it into the editor.

My problem is since WordPress 3.5 the button has stopped working. I'm not very good at jquery and only familiar enough with TinyMCE to understand how it's suppose to work. The original code I hired someone here to build for the popup window.

Now when a person clicks the TinyMCE button nothing happens at all. Now thinkbox overlay.

Here's the php part of the issue...

// register tinyMCE additional button
function tinyplugin_add_button($buttons) {
global $post;
global $post_type;
if($post && $post->post_type && $post->post_type == 'salesletters') {

array_push($buttons, "|", "tinySampleText");
array_push($buttons, "|", "code");
array_push($buttons, "|", "add_image");
}
return $buttons;

}

function tinyplugin_register($plugin_array) {
$plugin_array['tinySampleText'] = WP_PLUGIN_URL.'/wp-sales-letter/tinymcepop/tinyMCE_custom.js';
return $plugin_array;
}

// register required jquery plugin & css
function jQ_tools() {
wp_enqueue_script('jquerytools', TPATH.'/jquery.tools.min.js', array('jquery'), '1.2.5');
wp_register_style('tinyMCE_custom_style', TPATH.'/tinyMCE_custom.css');
wp_enqueue_style('tinyMCE_custom_style');
}
add_action('admin_init','jQ_tools');

function show_tinyMCE_dialog(){

global $contents;
if(!is_array($contents)) return;
?>
<div id="sample_text_box">
<label id="category_sample_label" for="category_sample">Select Category</label>
<select id="category_sample">
<option value="0">none</option>
<?php foreach ($contents as $category => $data){ ?>
<option value="<?php echo str_replace(' ','',$data['category']); ?>"><?php echo $data['category'] ?></option>
<?php } ?>
</select>
<?php foreach ($contents as $category => $data){ ?>
<div id="<?php echo str_replace(' ','',$data['category']); ?>" class="category_sample_text" style="display:none">
<?php foreach ($data['text'] as $text){ ?>
<span><?php echo $text; ?></span>
<?php } ?>
</div>
<?php } ?>
<div id="preview_tinyMCE">
<?php
$content = '';
$id = 'sample_text_editor';
$settings = array( 'textarea_rows' => '3');
wp_editor( $content, $id, $settings); ?>



</div>
<button type="button" class="button add-tinyMCE-text">Add Text</button>
<button type="button" class="button cancel-tinyMCE-text">Cancel</button>
</div>
<?php
}


Here's the JQuery Part of the issue... I'm not sure which is the problem...

jQuery(document).ready(function($){

var targetEditor;

$('#tinySample-meta').css('marginLeft','-100000em');

$('#sample_text_box').overlay();
var api_overlay = $('#sample_text_box').data("overlay");

function tiny_plugin() {
return "[tiny-plugin]";
}

(function() {
tinymce.create('tinymce.plugins.tinyplugin', {
init : function(ed, url){
ed.addButton('tinySampleText', {
title : 'Insert Sample Text',
onclick : function() {

targetEditor = tinyMCE.activeEditor.id;
api_overlay.load();

},
image: url + "/custom-tinyMCE.png"
});
}
});

tinymce.PluginManager.add('tinySampleText', tinymce.plugins.tinyplugin);

})();

$('#category_sample').change(function(){
$('.category_sample_text').hide();
var uniqueID = $(':selected',this).val();
if(uniqueID) $('#'+ uniqueID).show();
});

$('.category_sample_text span').each(function(){
$(this).click(function(){
var content = $(this).html();
tinyMCE.getInstanceById('sample_text_editor').setContent(content);
})
});

$('.add-tinyMCE-text').click(function(){

var inserted_content = tinyMCE.getInstanceById('sample_text_editor').getContent(),
formatted = inserted_content.replace(/^<p>+|<\/p>+$/g, '')

tinyMCE.execInstanceCommand(targetEditor, 'mceInsertContent', false, formatted);
$('#content').html(function(){ return $(this).html()+formatted});

api_overlay.close();

});
$('.cancel-tinyMCE-text').click(function(){
api_overlay.close();
});

api_overlay.onClose(function(){
tinyMCE.getInstanceById('sample_text_editor').setContent('');
$('#category_sample option:selected').removeAttr('selected');
$("#category_sample option[value='0']").attr('selected', 'selected');
$('.category_sample_text').hide();
});

});

Answers (2)

2013-01-08

Christianto answers:

Please change javascript part to this
http://pastebin.com/DHwVK9aD

Hope this help

---

Armand Morin comments:

That worked perfectly.!

2013-01-08

Arnav Joy answers:

did you checked console for any js error?

---

Armand Morin comments:

Yes, no js error.