重新初始化TinyMCE的4 AJAX [英] Reinitialize TinyMCE 4 in AJAX

问题描述

我使用的TinyMCE在Ajax启用基金会显示框。现在TinyMCE的踢在第一时间加载，但如果我关闭对话框，然后再次打开它不会触发：（

我的其它脚本如选择和的屏蔽在工作完全相同的前查询的触发，但是当我重新加载第二次TinyMCE的将不会重新初始化输入

这是我的code目前我试图建议在<一个href="http://stackoverflow.com/questions/14971384/having-issues-with-multiple-ajax-refresh-and-tinymce/14978745">this问题：

  $（文件）。在（'opened.fndtn.reveal'，'[数据显示]'，函数（）{
    $（＃expenseUser，#expenseVendorID，#expenseCategoryID，#expenseAccidentID）选择（{disable_search_threshold：5，宽度：'365px'}）;
    $（＃expOdo）掩码（999999，{占位符：0}）;。
    $（'。日期选择器'）。每个（函数（）{
        $（本）.datetimepicker（{
            addSliderAccess：真正的，
            sliderAccessArgs：{touchonly：假}，
            changeMonth：真正的，
            changeYear：真正的，
            altField：＃+ $（本）.attr（'身份证'）+Alt键，
            altFieldTimeOnly：假的，
            altFormat：YY-MM-DD，
            altTimeFormat：HH：MM：SS，
            DATEFORMAT：D，D MM YY，
            TIMEFORMAT：HH：mmtt
        }）;
    }）;
    tinymce.execCommand（'mceRemoveEditor'，真的，文本区域＃expenseComments）;
    tinymce.execCommand（'mceAddEditor'，真的，文本区域＃expenseComments）;
    tinyMCE.init（{选择：文本区域＃expenseComments，菜单栏：假的，工具栏：撤销重做| styleselect |粗斜体| alignleft aligncenter alignright}）;
}）;
 

更新时间：

我试图改变与运气以下，但我认为这是正确的道路往下走？

  $（文件）。在（'opened.fndtn.reveal'，'[数据显示]'，函数（）{
    $（＃expenseUser，#expenseVendorID，#expenseCategoryID，#expenseAccidentID）选择（{disable_search_threshold：5，宽度：'365px'}）;
    $（＃expOdo）掩码（999999，{占位符：0}）;。
    $（'。日期选择器'）。每个（函数（）{
        $（本）.datetimepicker（{
            addSliderAccess：真正的，
            sliderAccessArgs：{touchonly：假}，
            changeMonth：真正的，
            changeYear：真正的，
            altField：＃+ $（本）.attr（'身份证'）+Alt键，
            altFieldTimeOnly：假的，
            altFormat：YY-MM-DD，
            altTimeFormat：HH：MM：SS，
            DATEFORMAT：D，D MM YY，
            TIMEFORMAT：HH：mmtt
        }）;
    }）;
    tinyMCE.init（{选择：文本区域＃expenseComments，菜单栏：假的，工具栏：撤销重做| styleselect |粗斜体| alignleft aligncenter alignright}）;
}）;
$（文件）。在（'close.fndtn.reveal'，'[数据显示]'，函数（）{
    tinymce.execCommand（'mceRemoveEditor'，真的，文本区域＃expenseComments）;
}）;
 

解决方案

这里的问题是，在关闭对话框，不关闭内TinyMCE的实例不当会导致不显示编辑器中的第二次（因为还有一个TinyMCE的编辑器在可变window.tinymce.editors对象）。

解决方案：OnClose中（实际上破坏或删除之前）的框关闭编辑器

I'm using TinyMCE in an ajax enabled Foundation Reveal box. Now the TinyMCE kicks in the first time it loads, but if I close the box and open it again it doesn't trigger :(

I have other scripts like chosen and masked input triggered in the exact same fore query that work, but TinyMCE will not reinitialize when I reload it a second time

This is my code currently that I'm trying as recommended at this question:

$(document).on('opened.fndtn.reveal', '[data-reveal]', function () {
    $("#expenseUser, #expenseVendorID, #expenseCategoryID, #expenseAccidentID").chosen({disable_search_threshold: 5, width: '365px'});
    $("#expOdo").mask("999999",{placeholder:"0"});
    $('.datePicker').each(function() {
        $(this).datetimepicker({
            addSliderAccess: true,
            sliderAccessArgs: {touchonly: false},
            changeMonth: true,
            changeYear: true,
            altField: "#"+$(this).attr('id')+"Alt",
            altFieldTimeOnly: false,
            altFormat: "yy-mm-dd",
            altTimeFormat : "HH:mm:ss",
            dateFormat: "D, d MM yy",
            timeFormat: "hh:mmtt"
        });
    });
    tinymce.execCommand('mceRemoveEditor',true,"textarea#expenseComments");
    tinymce.execCommand('mceAddEditor',true,"textarea#expenseComments");
    tinyMCE.init({selector: "textarea#expenseComments",menubar : false,toolbar: "undo redo | styleselect | bold italic | alignleft aligncenter alignright"});
});

UPDATED

I've tried changing to the following with luck, but I think this is the right path to go down?

$(document).on('opened.fndtn.reveal', '[data-reveal]', function () {
    $("#expenseUser, #expenseVendorID, #expenseCategoryID, #expenseAccidentID").chosen({disable_search_threshold: 5, width: '365px'});
    $("#expOdo").mask("999999",{placeholder:"0"});
    $('.datePicker').each(function() {
        $(this).datetimepicker({
            addSliderAccess: true,
            sliderAccessArgs: {touchonly: false},
            changeMonth: true,
            changeYear: true,
            altField: "#"+$(this).attr('id')+"Alt",
            altFieldTimeOnly: false,
            altFormat: "yy-mm-dd",
            altTimeFormat : "HH:mm:ss",
            dateFormat: "D, d MM yy",
            timeFormat: "hh:mmtt"
        });
    });     
    tinyMCE.init({selector: "textarea#expenseComments",menubar : false,toolbar: "undo redo | styleselect | bold italic | alignleft aligncenter alignright"});
}); 
$(document).on('close.fndtn.reveal', '[data-reveal]', function () {
    tinymce.execCommand('mceRemoveEditor',true,"textarea#expenseComments");
}); 

解决方案

Problem here is that closing the box without shutting down the inner tinymce instance properly will result in not showing the editor the second time (because there is still a tinymce editor object in the variable window.tinymce.editors).

Solution: onclose (in fact before destroying or removing) of the box shut down the editor.

这篇关于重新初始化TinyMCE的4 AJAX的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！