MVC：将CKEditor textarea值绑定到模型

Question

我选择CKEditor作为ASP.Net MVC项目的富文本编辑器组件。

渲染富文本编辑器不是问题（事实上非常简单）：

@Html.TextAreaFor(model => model.MessageDiffusion.Message, new { @id = idRichTextEditor })

<script type="text/javascript">
    $(document).ready(function () {
    // Rich Text Editor (CKEditor) Configuration 
        CKEDITOR.replace(
            idRichTextEditor, {
                language: 'fr'
            }
        );
    });
</script>

呈现：

我的问题与发布数据有关。如果我将消息更改为：“新消息”，我的帖子上仍会显示“旧消息”：

我的意思是，viewModel将有一条属性消息，其中包含“旧消息”而不是“新消息”。 我试图在帖子之前立即执行以下操作（onBegin）：

  $('#idRichTextEditor').text(CKEDITOR.instances["idRichTextEditor"].getData());

或者：

。

$（ '＃idRichTextEditor'）VAL（CKEDITOR.instances [ “idRichTextEditor”]的getData（））;

哪个没有帮助......我也试过了：

for (var instanceName in CKEDITOR.instances) {
    CKEDITOR.instances["idRichTextEditor"].updateElement();
}

但我似乎无法将CKEditor的文本区域与我的模型绑定。我想说的是，如果我将这个富文本区域转换为公共文本区域，我可以轻松地在控制器端获得“新消息”。

我想说，尽管有趣，并且与我的问题有关，但以下stackoverflow的讨论并没有对我有多大帮助：

CKEditor MVC 3 implementation Help needed

CKEditor and ASP.Net MVC 3 RequiredAttribute

我认为这个问题可能与

这个事实有关

在CKEditor中设置数据是一个异步操作，如果任何元素是编辑器，val（'some data'）将返回一个jQuery Promise对象。您可以将它与jQuery助手一起使用： $ .when（$（'＃editor'）。val（'foo'））。then（function（）{     //现在您确定已设置数据。 }）;

我在这里阅读这些信息： CKEditor 4 documentation

更新：我刚刚意识到，当我第二次发布数据时，richtext信息被正确地绑定到我的viewmodel的Message属性。这意味着如果我单击“保存按钮”两次，我可以得到我想要的，但不能一次......

Answer 1

我想我在StackOverFlow上搜索得不够好，它确实能解决所有问题。正确的答案是：

$('#YOURFORMID').on('submit', function(){
    for ( instance in CKEDITOR.instances ) {
        CKEDITOR.instances[instance].updateElement();
    }
});

我在这里找到了：

CKEDITOR doesn't submit data via ajax on first submit