一、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. Handling events in an MVVM WPF application

      Posted: June 30, 2013 | Filed under: MVVM, WPF, XAML |1 Comment In a WPF application that uses the ...

  2. WPF: 旋转Thumb后,DragDelta移动距离出错的解决

    当Thumb跟随Grid旋转90度后,拖拽控件时会飞掉. <Grid x:Name="gridMain" Width="100" Height=" ...

  3. BZOJ 2527 & 整体二分

    Byteotian Interstellar Union有N个成员国.现在它发现了一颗新的星球,这颗星球的轨道被分为M份(第M份和第1份相邻),第i份上有第Ai个国家的太空站. 这个星球经常会下陨石雨 ...

  4. [SDOI2011]染色 题解

    题目大意: 给定一棵有n个节点的无根树和m个操作,操作有2类: 1.将节点a到节点b路径上所有点都染成颜色c: 2.询问节点a到节点b路径上的颜色段数量(连续相同颜色被认为是同一段) 思路: 树剖之后 ...

  5. Nginx 利用 X-Accel-Redirect response.setHeader 控制文件下载

    nginx.conf location / { proxy_redirect off; proxy_set_header Host $host; proxy_set_header X-Real-IP ...

  6. Codeforces Round #244 (Div. 2) B. Prison Transfer

    题目是选出c个连续的囚犯,而且囚犯的级别不能大于t #include <iostream> using namespace std; int main(){ int n,t,c; cin ...

  7. git的几种回滚 git revert 和 git reset的区别

    git的几种回滚 git revert 和 git reset的区别:强烈建议:对HEAD不熟的话最好不要用HEAD,直接用commitID吧,我遇到的问题:reset HEAD~1之后,可能是别人提 ...

  8. 【CodeVS】p1038 一元三次方程求解

    题目描述 Description 有形如:ax3+bx2+cx+d=0  这样的一个一元三次方程.给出该方程中各项的系数(a,b,c,d  均为实数),并约定该方程存在三个不同实根(根的范围在-100 ...

  9. BZOJ4491: 我也不知道题目名字是什么

    Description 给定一个序列A[i],每次询问l,r,求[l,r]内最长子串,使得该子串为不上升子串或不下降子串 Input 第一行n,表示A数组有多少元素接下来一行为n个整数A[i]接下来一 ...

  10. Flex条件判断中注意事项

    1:等于判断条件,一定注意写两个==等号, if (obj.ProcessType="Relation") 如果只写一个等号,编译不会报错,并且Flex会认为是赋值操作,并且该语句 ...