简单2步实现 asp.net mvc ckeditor 图片上传
1.打开ckeditor 包下的 config.js,添加一句 配置(PS:ckeditor 很多功能都在该配置文件里配置),如下:
config.filebrowserImageUploadUrl = "/Home/Upload";
说明:ckeditor 默认编辑框的图片功能里是没有 “上传” 这个tab选项的,当配置上面那句后,就会出现“上传” tab选项。 后面的 "/Home/Upload" 表示 图片上传的后台处理程序路径。为了更直观的看到效果,下面为图片演示。
2.在Controller在实现upload Action,保存图片。
[HttpPost] public ActionResult Upload(HttpPostedFileBase upload) { var fileName = System.IO.Path.GetFileName(upload.FileName); var filePhysicalPath = Server.MapPath("~/upload/" + fileName);//我把它保存在网站根目录的 upload 文件夹 upload.SaveAs(filePhysicalPath); var url = "/upload/" + fileName; var CKEditorFuncNum = System.Web.HttpContext.Current.Request["CKEditorFuncNum"]; //上传成功后,我们还需要通过以下的一个脚本把图片返回到第一个tab选项 return Content("<script>window.parent.CKEDITOR.tools.callFunction(" + CKEditorFuncNum + ", \"" + url + "\");</script>"); }
说明:就是第1步那一句配置,我们的本地图片上传功能差不多完成了一半了,而在这一步我们需要做的是把本地上传的图片保存到服务器,并使它在编辑框内显示。在上面那句配置里,我写了一个url路径,那么我们的图片上传就在这这个路径中处理,其实我们通过 F12 可以发现,它就是一个 <input type = 'file' />这样的标签,跟简单的文件上传没上面区别。下面为图片演示:
我在google上找到了一篇文章,他上面介绍了两种方式,一种是我这种在ckeditor中配置,另一种是通过外部的上传控件实现,然后再把它图像嵌入到ckeditor中去。
链接:http://www.codedigest.com/Articles/ASPNET/423_Upload_Images_and_Integrate_with_CKeditor_in_AspNet.aspx
简单2步实现 asp.net mvc ckeditor 图片上传的更多相关文章
- Asp.net MVC 实现图片上传剪切
使用技术:Asp.net MVC与jquery.uploadify,Jcrop 首先上页面 01 <strong><!DOCTYPE html> 02 <html> ...
- c# ASP.NET MVC easyui-filebox 图片上传和显示
原文:https://www.cnblogs.com/huatao/p/4727398.html https://www.cnblogs.com/weiweithe/p/4363458.html 表单 ...
- Asp.net mvc 大文件上传 断点续传
Asp.net mvc 大文件上传 断点续传 进度条 概述 项目中需要一个上传200M-500M的文件大小的功能,需要断点续传.上传性能稳定.突破asp.net上传限制.一开始看到51CTO上的这 ...
- MVC图片上传、浏览、删除 ASP.NET MVC之文件上传【一】(八) ASP.NET MVC 图片上传到服务器
MVC图片上传.浏览.删除 1.存储配置信息 在web.config中,添加配置信息节点 <appSettings> <add key="UploadPath" ...
- ASP.NET MVC+LayUI视频上传
前言: 前段时间在使用APS.NET MVC+LayUI做视频上传功能的时,发现当上传一些内存比较大的视频就会提示上传失败,后来通过查阅相关资料发现.NET MVC框架为考虑安全问题,在运行时对请求的 ...
- springMVC和ckeditor图片上传
springMVC和ckeditor图片上传 http://blog.csdn.net/liuchangqing123/article/details/45270977 修正一下路径问题: packa ...
- 探索Asp.net mvc 的文件上传
(转自:http://www.cnblogs.com/n-pei/archive/2010/10/15/1852635.html) 最近因为TeamVideo需要用到视频和图片上传功能,所以试着Goo ...
- 探索Asp.net mvc 的文件上传(由浅入深)
代码下载:http://files.cnblogs.com/n-pei/mvcfileupload.zip 最近因为TeamVideo需要用到视频和图片上传功能,所以试着Google了很多资料,和大家 ...
- .net core CKEditor 图片上传
最近在玩 asp.net core,不想用UEditor,想使用CKEditor.故需要图片上传功能. 废话不多说,先上效果图: CKEditor 前端代码: <text id="co ...
随机推荐
- MapReduce的InputFormat学习过程
昨天,经过几个小时的学习.该MapReduce学习的某一位的方法的第一阶段.即当大多数文件的开头的Data至key-value制图.那是,InputFormat的过程.虽说过程不是非常难,可是也存在非 ...
- 给Notepad++ 6.7 加右键菜单带图标
使用的是Notepad++ 6.7,下载 NppShell64.dll 和 NppShell.dll方法:将BAT文件和下载的NppShell64.dll 和 NppShell.dll放置Notepa ...
- Android Bluetooth Stack: Bluedroid(五岁以下儿童):The analysis of A2DP Source
1. A2DP Introduction The Advanced Audio Distribution Profile (A2DP) defines the protocols and proced ...
- animation渐进实现点点点等待效果实例页面
CSS代码: .ani_dot { font-family: simsun; } :root .ani_dot { display: inline-block; width: 1.5em; verti ...
- 客户端javascript
<script> function moveon(){ var answer=confirm("hello,good morning!");//通过弹出对话框询问用户 ...
- php rsa 加密、解密、签名、验签
由于对接第三方机构使用的是Java版本的rsa加解密方法,所有刚开始在网上搜到很多PHP版本的rsa加解密,但是对接java大多都不适用. 以下php版本是适用于对接java接口,java适用密钥再p ...
- Android小应用-----画画板
public class MainActivity extends Activity { private ImageView iv; float startX = 0; float startY = ...
- Java 异常归纳总结
1.异常的分类 1) Checked exception: 这类异常都是Exception的子类 .异常的向上抛出机制进行处理,如果子类可能产生A异常,那么在父类中也必须throws A异常.可能导致 ...
- openwrt路由器更换了Flash之后需要修改的源码
假如我使用的是WR703N,改为8M内存: 1 修改openwrt/target/linux/ar71xx/image/Makefile文件 $(eval $(call SingleProfile,T ...
- MUI初始化滚动区域
mui(".mui-scroll-wrapper").scroll().refresh(); 如果不是MUI对象,需要转一下才可 mui($("#areaDiv" ...