ASP.NET MVC 5 中 使用富文本编辑器 Ueditor
一、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的更多相关文章
- MVC项目中应用富文本编辑器UEditor中的几个坑
UEditor:百度出品 官网连接:http://ueditor.baidu.com/website/ 错误现象:在官网上复制到本地后,上传图片功能不能用, 控制台提示:“请求后台配置项http错误, ...
- Django中使用富文本编辑器Uedit
Uedit是百度一款非常好用的富文本编辑器 一.安装及基本配置 官方GitHub(有详细的安装使用教程):https://github.com/zhangfisher/DjangoUeditor 1. ...
- Django后台管理admin或者adminx中使用富文本编辑器
在admin或者adminx后台中使用富文本编辑器 一.建立模型:(安装django-tinymce==2.6.0) from django.db import models from tinymce ...
- flask项目中使用富文本编辑器
flask是一个用python编写的轻量级web框架,基于Werkzeug WSGI(WSGI: python的服务器网关接口)工具箱和Jinja2模板,因为它使用简单的核心,用extension增加 ...
- Django实现的博客系统中使用富文本编辑器ckeditor
操作系统为OS X 10.9.2,Django为1.6.5. 1.下载和安装 1.1 安装 ckeditor 下载地址 https://github.com/shaunsephton/django-c ...
- 在MVC3中使用富文本编辑器:KindEditor的配置及上传图片
现在比较常用的富文本编辑挺多的,如ueditor.fckeditor.kingeditor等,本文主要介绍一下KindEditor的配置与使用. 先去官网http://www.kindsoft.net ...
- Django使用富文本编辑器
1.下载kindeditor 网址:http://kindeditor.net/demo.php2.解压到项目中 地址:\static\js\kindeditor-4.1.103.删除没用的文件 例如 ...
- django-应用中和amdin使用富文本编辑器kindeditor
文章描述.新闻详情和产品介绍等,都需要大量的文字描述信息或图片.视频.文字的编辑等,这个时候我们就需要介绍第三方富文本编辑器. 今天介绍的是django中绑定和应用kindeditor编辑器: 效果如 ...
- vue+element-ui 使用富文本编辑器
npm安装编辑器组件npm install vue-quill-editor –save 在components文件夹创建ue.vue组件,如下 ue.vue代码如下: <!-- 组件代码如下 ...
随机推荐
- JavaScript 参考手册——javascript本地和内置对象、BOM、DOM
本部分提供完整的 JavaScript 参考手册: JavaScript 本地对象和内置对象 Browser 对象(BOM) HTML DOM 对象 JavaScript 对象参考手册 本参考手册描述 ...
- ACM ICPC 2015 Moscow Subregional Russia, Moscow, Dolgoprudny, October, 18, 2015 G. Garden Gathering
Problem G. Garden Gathering Input file: standard input Output file: standard output Time limit: 3 se ...
- BZOJ3946 : 无聊的游戏
首先把所有串拼起来,后插入的串在前面,得到一个大串. 那么任意时刻,每个串是由这个大串的若干个不相交的子串从左到右拼接而成. 用线段树维护每个串,每个节点维护一个标记,表示区间内的串要加上什么前缀. ...
- Android 热补丁和热修复
参考: 各大热补丁方案分析和比较 Android App 线上热修复方案 1. Xposed Github地址:https://github.com/rovo89/Xposed 项目描述:Xposed ...
- Codeforces Round #249 (Div. 2) A. Black Square
水题 #include <iostream> #include <vector> #include <algorithm> using namespace std; ...
- ubuntu 安装Firefox 29.0
下载Firefox 29.0 % cd ~/Downloads % sudo cp firefox-29.0.tar.bz2 /opt % cd /opt % sudo tar -xvjf firef ...
- [Cocos2D-x For WP8]Label标签
Label标签主要会用于在游戏中显示一些文字字符串类型的信息.那么在Cocos2D-x里面主要会有下面的一些创建标签的方式: 1.使用CCLabelTTF类生成系统文字的标签,编程语法如下: CCLa ...
- Rockey 4加密狗介绍
Rockey 4加密狗介绍 特点:该加密狗是单片机加密狗时代飞天公司的主力产品,R4一样继承了R2的硬件特征,具有全球唯一性硬件ID.R4内置了硬件随机数生成器,可以进行一些抗跟踪,或在硬件算法中参与 ...
- 李洪强经典面试题136-KVO-KVC
李洪强经典面试题136-KVO-KVC KVC-KVO KVC的底层实现? 当一个对象调用setValue方法时,方法内部会做以下操作: ①检查是否存在相应key的set方法,如果存在,就调用se ...
- 遍历Map的两种方法(有排序)
初始化一个map Map<String, String> map = new HashMap<String, String>(); map.put("1", ...