一、Ueditor插件下载自:http://ueditor.baidu.com/website/

二、将解压文件目录ueditor复制到项目根目录后,

  修改以下几个文件配置:

    1.访问路径配置:ueditor.config.js

      //为编辑器实例添加一个路径,这个不能被注释

      UEDITOR_HOME_URL: "http://localhost:4458/ueditor/"

      // 服务器统一请求接口路径
      , serverUrl: URL + "/net/controller.ashx"

    2.上传文件相关配置config.json

      "imageUrlPrefix": "/ueditor/net/", /* 图片访问路径前缀 */
      "imagePathFormat": "upload/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */

三、前台添加使用

  1.引用脚本

    <script type="text/javascript" src="~/Scripts/ueditor/ueditor.config.js" />

    <script type="text/javascript" src=""~/Scripts/ueditor/ueditor.all.js  />

    或添加至BundleConfig,

      bundles.Add(new ScriptBundle("~/bundles/ueditor").Include(

      "~/Scripts/ueditor/ueditor.config.js",

      "~/Scripts/ueditor/ueditor.all.js"));

    在前台引用

      @section Scripts {

        @Scripts.Render("~/bundles/jqueryval")
        @Scripts.Render("~/bundles/ueditor")
      }

  2.将如下代码添加富文本输入框位置:

    <script id="Location" type="text/plain" style="width:200px;height:100px;">
    </script>

  3.初始化

    <script type="text/javascript">

      var ue = UE.getEditor('Location');

    </script>

  4.前台显示

    @Html.Raw(item.Location)

三、后台获取提交

    1、提交的Action要取消验证,即添加ValidateInput(false)

      [ValidateInput(false)]
      public ActionResult Create([Bind(Include = "LastName,FirstMidName,HireDate,OfficeAssignment")] Instructor instructor, FormCollection fc,             string[] selectedCourses){

      …………

          if ( fc != null && fc.Get("Location") != null)

          string strdata= fc.Get("Location");//获取提交的编辑信息

    }

ASP.NET MVC 5 中 使用富文本编辑器 Ueditor的更多相关文章

  1. MVC项目中应用富文本编辑器UEditor中的几个坑

    UEditor:百度出品 官网连接:http://ueditor.baidu.com/website/ 错误现象:在官网上复制到本地后,上传图片功能不能用, 控制台提示:“请求后台配置项http错误, ...

  2. Django中使用富文本编辑器Uedit

    Uedit是百度一款非常好用的富文本编辑器 一.安装及基本配置 官方GitHub(有详细的安装使用教程):https://github.com/zhangfisher/DjangoUeditor 1. ...

  3. Django后台管理admin或者adminx中使用富文本编辑器

    在admin或者adminx后台中使用富文本编辑器 一.建立模型:(安装django-tinymce==2.6.0) from django.db import models from tinymce ...

  4. flask项目中使用富文本编辑器

    flask是一个用python编写的轻量级web框架,基于Werkzeug WSGI(WSGI: python的服务器网关接口)工具箱和Jinja2模板,因为它使用简单的核心,用extension增加 ...

  5. Django实现的博客系统中使用富文本编辑器ckeditor

    操作系统为OS X 10.9.2,Django为1.6.5. 1.下载和安装 1.1 安装 ckeditor 下载地址 https://github.com/shaunsephton/django-c ...

  6. 在MVC3中使用富文本编辑器:KindEditor的配置及上传图片

    现在比较常用的富文本编辑挺多的,如ueditor.fckeditor.kingeditor等,本文主要介绍一下KindEditor的配置与使用. 先去官网http://www.kindsoft.net ...

  7. Django使用富文本编辑器

    1.下载kindeditor 网址:http://kindeditor.net/demo.php2.解压到项目中 地址:\static\js\kindeditor-4.1.103.删除没用的文件 例如 ...

  8. django-应用中和amdin使用富文本编辑器kindeditor

    文章描述.新闻详情和产品介绍等,都需要大量的文字描述信息或图片.视频.文字的编辑等,这个时候我们就需要介绍第三方富文本编辑器. 今天介绍的是django中绑定和应用kindeditor编辑器: 效果如 ...

  9. vue+element-ui 使用富文本编辑器

    npm安装编辑器组件npm install vue-quill-editor –save 在components文件夹创建ue.vue组件,如下 ue.vue代码如下: <!-- 组件代码如下 ...

随机推荐

  1. 【SAP BO】BOE 4.1版本新特性

    为了更好地向用户推广BusinessObjects BI 4.1版本的新特性,SAP公司宣布将在2012年中旬推出针对BusinessObjects BI 4.0的功能补丁程序(Feature Pac ...

  2. oralce CASE WHEN 用法

    如何将时间日期分隔成“上半月”“下半月” select ( THEN '上半月' THEN '下半月' ELSE 'NULL' END) AS mon from BFBHDD8.SKTXSJL

  3. [WP8.1UI控件编程]Windows Phone XAML页面的编译

    1.1.2 XAML页面的编译 Windows Phone的应用程序项目会通过Visual Studio完成XAML页面的编译,在程序运行时会通过直接链接操作加载和解析XAML,将XAML和过程式代码 ...

  4. 【BZOJ】1109: [POI2007]堆积木Klo

    题意 \(n(1 \le n \le 100000)\)个数放在一排,可以一走一些数(后面的数向前移),要求最大化\(a_i=i\)的数目. 分析 分析容易得到一个dp方程. 题解 \(d(i)\)表 ...

  5. URAL 1427. SMS(DP+单调队列)

    题目链接 我用的比较传统的办法...单调队列优化了一下,写的有点搓,不管怎样过了...两个单调队列,存两个东西,预处理一个标记数组存... #include <iostream> #inc ...

  6. poj 2239 二分图最大匹配,基础题

    1.poj 2239   Selecting Courses   二分图最大匹配问题 2.总结:看到一个题解,直接用三维数组做的,很巧妙,很暴力.. 题意:N种课,给出时间,每种课在星期几的第几节课上 ...

  7. 瀑布流 &留言板

    实例:瀑布流 留言板(一)瀑布流瀑布流实现原理分析1.ajax文件内容function ajax(method, url, data, success) {    var xhr = null;   ...

  8. Sping Environment为Null的原因和解决方法

    参考:https://github.com/spring-projects/spring-boot/issues/4711 这个issue提出不到20天给我搜出来了,还是相信google的强大 问题: ...

  9. JavaScript事件对象【转】

    一. 事件对象 事件处理三部分组成:对象.事件处理函数=函数.例如:单击文档任意处. 1.鼠标按钮 非 IE(W3C)中的 button 属性 0 表示主鼠标按钮(常规一般是鼠标左键) 1 表示中间的 ...

  10. Oracle连接超时

    客户机 要想 连接 oracle服务机(装了数据库的机子),只需要在客户机配置一个 本地服务名就行了,不管你用Oracle服务端的配置工具 还是客户端的配置工具,都没有问题. 如果只是客户机连接服务机 ...