如何在我的ASP.NET MVC应用程序中使用ACE?

ber*_*slu 11 javascript css asp.net-mvc ace-editor

我想在我的项目中使用ACE在线代码编辑器.我如何在ASP.NET MVC中使用它?

我想在数据库中保存使用该编辑器进行的任何编辑.我怎么做?

Jan*_*oom 13

假设您有一个强类型模型,其中包含一个Editor带有数据的属性.现在使用normal <div>来加载数据:

<div id="editor"><%=Model.Editor %></div>
Run Code Online (Sandbox Code Playgroud)

现在你可以使用javascript创建一个ace编辑器代替div:

<script src="src/ace.js" type="text/javascript" charset="utf-8"></script>
<script>
window.onload = function() {
    var editor = ace.edit("editor");
};
</script>
Run Code Online (Sandbox Code Playgroud)

现在,当您想要保存数据时,例如通过表单发布,使用类似的东西将其绑定回Editor模型的属性:

<%=Html.HiddenFor(m=>m.Editor, new { @id = "hidden_editor" }) %>

<!-- this is jQuery, but you can use any JS framework for this -->
<script>
    $("form").submit(function () {
        $("#hidden_editor").val(editor.getSession().getValue());
    });
</script>
Run Code Online (Sandbox Code Playgroud)

在控制器中,您现在可以将数据保存到数据库中

[HttpPost]
public ActionResult Index (IndexModel model) {
    var data = model.Editor;
    // save data in database
}
Run Code Online (Sandbox Code Playgroud)