1

我正在尝试在我的 MVC3 项目中使用 TinyMCE 编辑器。我让它在浏览器中显示并正常工作，但无法将其中的数据与表单一起回发。

我的观点（片段）：

<div  class="formRow">
    <div class="formFieldFull">
        <div class="editor-label">
            @Html.LabelFor(model => model.Conditions)
        </div>
        <div class="large-multiline-field" style="width:396px;">
            @Html.EditorFor(model => model.Conditions)
        </div>
        <div class="validationMsg">
            @Html.ValidationMessageFor(model => model.Conditions)
        </div>
    </div>
</div>

如果没有 TinyMCE，条件字段将呈现为文本区域。使用 TinyMCE，它会用自己的东西覆盖文本区域，这似乎就是问题所在。原来的 textarea 在那里，但它已设置为 display:none。TinyMCE 在一些标签之间制作了字段内容的副本，这似乎是编辑内容所在的位置。当我发回表单时，原始文本区域仍然包含来自原始响应的字段内容，而不是应该传回的编辑内容。

这是使用 TinyMCE 渲染的代码（在 Firebug 中）的样子：

<div class="large-multiline-field" style="width:396px;">
    <textarea id="Conditions" rows="2" name="Conditions" data-val-length-max="2000" data-val-length="Conditions must be under 2000 characters." data-val="true" cols="20" length="40" style="display: none;" aria-hidden="true">
---->   ACTUAL CONTENT GOES HERE
    </textarea>
    <span id="Conditions_parent" class="mceEditor defaultSkin" role="application" aria-labelledby="Conditions_voice">
        <span id="Conditions_voice" class="mceVoiceLabel" style="display:none;">Rich Text Area</span>
        <table id="Conditions_tbl" class="mceLayout" cellspacing="0" cellpadding="0" role="presentation" style="width: 404px; height: 222px;">
            <tbody>
                <tr class="mceFirst" role="presentation">
                    TinyMCE Toolbars go here
                </tr>
                <tr class="mceLast">
                    <td class="mceIframeContainer mceFirst mceLast">
                        <iframe id="Conditions_ifr" frameborder="0" src="javascript:""" allowtransparency="true" title="Rich Text AreaPress ALT-F10 for toolbar. Press ALT-0 for help" style="width: 100%; height: 153px; display: block;">
                            <html>
---->                           EDITED CONTENT GOES HERE
                            </html>
                        </iframe>
                    </td>
                </tr>
            </tbody>
        </table>
    </span>
</div>

我应该做些什么来让 TinyMCE 在回发之前用编辑过的内容更新原始文本区域？

4

1 回答 1

3

解决方案很简单。您需要发出一小段 javascript，以便将内容从编辑器写回到根 html 元素（文本区域）。通常有一些浏览器事件会触发回写功能，但看起来这些事件不会因任何原因被触发。这是在将表单发送到服务器之前需要调用的简单 js 代码片段：

tinymce.triggerSave();
于 2012-05-02T09:02:17.683 回答