TinyMCE验证会出错:无法调用方法' getContent'未定义的

时间:2012-08-23 21:34:11

标签: javascript jquery asp.net-mvc jquery-ui tinymce

我有一个带有小mce的文本区域,我加载它:

$(document).ready(function () {

    tinyMCE.init({
        mode: "textareas",
        ...

此文字区域为一种形式。我将表单提交按钮绑定到:

$('#btnSubmit').click(function() {

    tinymce.triggerSave();

    var editorContent = tinyMCE.get('Description').getContent();
    if (editorContent == '' || editorContent == null)
    {
        $(tinymce.activeEditor.getBody()).css("background-color", '#ffeeee');
        $(tinymce.activeEditor.getBody().parentNode).css("background-color", '#ffeeee');
        $(tinymce.activeEditor.getBody().parentNode).css("border", '1px solid #ff0000');
    }
});

在我的实体课程中,我有Required属性 我的目标是在模型无效时创建tinyMCE背景red。但我从问题标题中得到错误。
有什么帮助吗? 因此,验证工作。如果我删除textarea空检查并保持颜色更改它会更改。但问题是文本区域有什么东西,我点击提交区域先变红,然后提交 如果验证失败,我可以做些什么吗?

2 个答案:

答案 0 :(得分:5)

听起来像是一个未定义的对象错误 - 代码无法解析此行tinyMCE.get('Description').getContent();

您似乎有时会在使用activeEditor和其他时间之间混合使用,所以相反我会对代码进行标准化,因此您始终依赖activeEditor - 这意味着我已删除了正在触发错误。您似乎也在使用tinymcetinyMCE之间切换,这可能不会导致问题,但最好避免......所以我也将其标准化。

没有看到更多的代码和标记的设置方式,但是要确切知道发生了什么有点困难。我的修改会修复问题吗?

$('#btnSubmit').click(function() {

  tinyMCE.triggerSave();

  var editorContent = tinyMCE.activeEditor.getContent();
  if (editorContent == '' || editorContent == null)
  {
    $(tinyMCE.activeEditor.getBody())
      .css("background-color", '#ffeeee')
      .parent()
      .css({
        "background-color": '#ffeeee',
        "border": '1px solid #ff0000'
      });
  }
});

答案 1 :(得分:0)

如果您无法控制TinyMCE的init方法,则可以按照此解决方案进行操作。

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

    function myCustomSetContent( id, content ) {
        // Check if TinyMCE is defined or not.
        if( typeof tinymce != "undefined" ) {
            var editor = tinymce.get( id );
            // Check if TinyMCE is initialized properly or not.
            if( editor && editor instanceof tinymce.Editor ) {
                editor.setContent( text );
                editor.save( { no_events: true } );
            } else {
                // Fallback
                // If TinyMCE is not initialized then directly set the value in textarea.
                //TinyMCE will take up this value when it gets initialized.
                jQuery( '#'+id ).val( text );
            }
            return true;
        }
        return false;
    }

    function myCustomGetContent( id ) {
        // Check if TinyMCE is defined or not.
        if( typeof tinymce != "undefined" ) {
            var editor = tinymce.get( id );
            // Check if TinyMCE is initialized properly or not.
            if( editor && editor instanceof tinymce.Editor ) {
                return editor.getContent();
            } else {
                // Fallback
                // If TinyMCE is not initialized then directly set the value in textarea.
                // TinyMCE will take up this value when it gets initialized.
                return jQuery( '#'+id ).val();
            }
        }
        return '';
    }

    $(".class-to-update-content").on("click", function(e) {
        myCustomSetContent( "tinymce-editor-id", "New Content in Editor" );
    });

    $(".class-to-get-content").on("click", function(e) {
        $("div.class-to-display-content").html( myCustomGetContent( "tinymce-editor-id" ) );
    });
});

参考:http://blog.incognitech.in/tinymce-undefined-issue/