且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

KindEditor在asp.net mvc4中使用

更新时间:2022-09-13 19:36:05

1、 准备工作

KindEditor,是一个相对来说功能比较强的编辑器(因为上篇博文中的HTMLBox不能上传文件),它的下载地址:http://www.kindsoft.net/down.php
解压后的文件如下图:KindEditor在asp.net mvc4中使用
2、 创建ASP.NET MVC 2.0 Razor项目,选择“空”项。
A.          同上篇博文第2步的A。
B.          添加KindEditor文件,如下图:

KindEditor在asp.net mvc4中使用

3、 与上篇博客第三步相同
4、 与上篇博客第四步相同
5、 在View中创建文件夹Test,并添加Index.cshtml,代码如下:
 @model MVC4_KindEditor.Models.TestModel
@{
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    <script src="~/Script/jquery-1.7.1.min.js"></script>
    <script src="~/KindEditor/kindeditor-min.js"></script>
    <script src="~/KindEditor/lang/zh_CN.js"></script>
 
    <script>
        var editor;
        KindEditor.ready(function (K) {
            editor = K.create('#Content', {
                width: 700,//编辑器宽度
                height: 200,//编辑器高度
                minWidth: 300,//编辑器最小宽度
                minHeight: 100,//编 辑器最小高度
                uploadJson: 'KindEditor/asp.net/upload_json.ashx',//接收上传文件处理程序
                fileManagerJson: 'KindEditor/asp.net/file_manager_json.ashx'//浏览远程图片的服务器端程序
            });
        });
    </script>
 
</head>
<body>
    @using (Html.BeginForm())
    {
        @Html.LabelFor(mod => mod.Title)
        <br />
        @Html.EditorFor(mod => mod.Title)
        <br />
        <br />
        @Html.LabelFor(mod => mod.Content)
        <br />
        @Html.EditorFor(mod => mod.Content)
        <br />
        <input type="submit" value="提交" />
    }
</body>
</html>
提示:
同上篇博文(哈哈)。














本文转自桂素伟51CTO博客,原文链接: http://blog.51cto.com/axzxs/1006253,如需转载请自行联系原作者