CK 编辑器在回发时更改内容 (4.10.1)

Question

当模型状态无效时，CKEditor 对其 html 内容进行编码时遇到问题。例如，如果我提交 "Hello World" 它作为编码的 html 字符串成功命中服务器 Hello World.

如果我想加载内容，我将解码的 html 字符串作为值传递给文本区域，它可以很好地加载 Hello World。但是，如果页面回发，例如当 (!ModelState.IsValid) 时，它会错误地呈现为：

Hello World

这是关键，它 仍然接收 Hello World 作为回发中的字段值。给出了什么？

我正在使用以下来源：

const ckEditorSrc = "//cdn.ckeditor.com/4.10.1/standard/ckeditor.js";

和波纹管初始化器：

CKEDITOR.replace('js-ck-editor', { htmlEncodeOutput: true});
CKEDITOR.config.height = 600;

我已经检查过，初始化程序在回发后被命中。

唯一可能有用的其他信息是使用简单的 loadScript 函数动态加载源。

function loadScript(url, callback) {// loads a script onto a page
    var script = document.createElement("script");
    script.type = "text/javascript";
    if (script.readyState) {  //IE
        script.onreadystatechange = function () {
            if (script.readyState === "loaded" || script.readyState === "complete") {
                script.onreadystatechange = null;
                callback();
            }
        };
    } else {  //Others
        script.onload = function () {
            callback();
        };
    }

    script.src = url;
    document.getElementsByTagName("head")[0].appendChild(script);
}

为简洁起见，这里是完整的初始化函数：

var ckEditor = function () {// init ckeditor

    if ($('#js-ck-editor').length) {
        const ckEditorSrc = "//cdn.ckeditor.com/4.10.1/standard/ckeditor.js";
        loadScript(ckEditorSrc, function () {

            CKEDITOR.replace('js-ck-editor', { htmlEncodeOutput: true});
            CKEDITOR.config.height = 600;
        }
    }
}

Answer 1

原来问题出在使用 asp.net html 助手上。

我改了@Html.TextAreaFor(m=>m.Text)

到<textarea name="Text" id="js-ck-editor">@Model.Text</textarea>

现在可以正常使用了。在滚动了几个小时的 ckeditor 文档后，事实证明这是一个非常简单的解决方案。啊，希望有一天这对其他人有所帮助。

Answer 2

进行回发时，您将填充 ModelState。

@Html.TextAreaFor(x => x.Text) 尝试解析此 ModelState。它将解析为编码值，并再次对其进行编码（两次）。

您可以在返回视图之前在 Post 操作中调用 ModelState.Clear()

CK 编辑器在回发时更改内容 (4.10.1)

CK Editor altering content on postback (4.10.1)

javascript

asp.net-mvc

ckeditor

wysiwyg

ckeditor4.x