MTAppJSONTable 内のテキストエリアをリッチテキストエディタ(TinyMCE)にする方法をご紹介します。
【2017/01/10 追記】
MTAppjQuery v1.10.0 までの MTAppJSONTable では、下記の方法だと不具合が発生します。次のバージョンの MTAppjQuery で実装できるように MTAppJSONTable にオプションを追加する予定ですのでお待ちください。
先ほど、「MTAppJSONTableでつくった textarea でリッチテキスト(TinyMCE)モードを使いたいのですが、なにか方法はあるでしょうか?」というご質問をいただきました。
簡単にですがその方法をご紹介します(MTAppJSONTable の設定方法などは割愛します)。
例えば、TinyMCE にしたいテキストエリアの header
名が content_profile
だとすると、下記のコードを cbAfterBuild
オプションに設定します。
cbAfterBuild: function(cb, $container){
var jsontableEditors = {};
$container.find('td.content_profile textarea').each(function(){
$(this).addClass('mtapp-has-tinymcs');
var id = $.temporaryId();
$(this).attr('id', id);
jsontableEditors[id] = new MT.EditorManager(id);
});
}
なお、 $.temporaryId()
は最新版の v1.10.0 以降に実装されていますので、もしそれ以前のバージョンをお使いでしたら、 MTAppJSONTable
を実行するよりも手前に、
$.extend({
temporaryId: function() {
return 'temp-' + ('' + Math.random()).replace(/[^\d]/g, '');
}
});
を書いておいてください。
また、行や列を追加できるように add: true
が設定されている場合は、下記のコードを cbAfterAdd
オプションに書いてください。
cbAfterAdd: function(cb, $container){
var jsontableEditors = {};
$container.find('td.content_profile textarea:not(".mtapp-has-tinymcs")').each(function(){
$(this).addClass('mtapp-has-tinymcs');
var id = $.temporaryId();
$(this).attr('id', id);
jsontableEditors[id] = new MT.EditorManager(id);
});
}
詳細な検証はしていませんので、もし不具合等ありましたらご指摘ください。
以上です。