我正在尝试在我的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,“条件”字段将呈现为textarea。使用TinyMCE,它用自己的东西覆盖textarea,这似乎是问题所在。原始textarea在那里,但它已设置为display:none。 TinyMCE已经在一些标签之间放置了一个字段内容的副本,这似乎是编辑内容所在的位置。当我发布表单时,原始文本区域仍然包含来自orignal响应的字段内容,而不是应该传回的已编辑内容。
以下是使用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在回发之前使用已编辑的内容更新原始textarea?
答案 0 :(得分:3)
解决方案很简单。您需要发出一小段javascript才能将内容从编辑器写回根html元素(textarea)。通常有一些浏览器事件会触发回写功能,但看起来不会因为任何原因而被触发。以下是在将表单发送到服务器之前需要调用的简单js-code片段:
tinymce.triggerSave();