summernote上传图片保存路径(C#)

1.写一个div,ID为Content

1 <div id="Content" class="summernoteContent">
2 
3 </div>

2.让其成为富文本框,并且传递到后台

 1 $("#Content").summernote({
 2             height: 200,
 3             lang: 'zh-CN',
 4             minHeight: null,
 5             maxHeight: null,
 6             airPopover: [['color', ['color']], ['font', ['bold', 'underline', 'clear']], ['para', ['ul', 'paragraph']], ['table', ['table']], ['insert', ['link', 'picture']]],
 7             onChange: function (e) {
 8                 $("input[id=Content]").val($('.summernoteContent').code());
 9             },
10             onChange: function (e) {    
11                 $("input[id=news_content]").val($('.summernoteContent').code());
12             },
13             onblur: function (e) {
14                 $("input[id=news_content]").val($('.summernoteContent').code());
15             },
16             onImageUpload: function (files, editor, $editable) {
17                 sendFile(files[0]);
18             },
19         });
20         function sendFile(file) { 
21             data = new FormData();
22             data.append("file", file);
23             $.ajax({
24                 data: data,
25                 type: "POST",
26                 url: "/News/Upload", //图片上传出来的url,返回的是图片上传后的路径,http格式  
27                 contentType: false,
28                 cache: false,
29                 processData: false,
30                 success: function (data) {
31                     //data是返回的hash,key之类的值,key是定义的文件名  
32                     alert(data);
33                     //把图片放到编辑框中。editor.insertImage 是参数,写死。后面的http是网上的图片资源路径。  
34                     //网上很多就是这一步出错。  
35                     $('#Content').summernote('editor.insertImage', "http://res.cloudinary.com/demo/image/upload/butterfly.jpg");
36                     37                 },
38                 error: function () {
39                     $(".note-alarm").html("上传失败");
40                     setTimeout(function () { $(".note-alarm").remove(); }, 3000);
41                 }
42             });
43         }

3.后台接收数据并保存

 1 public ActionResult Upload()
 2         {
 3             HttpPostedFileBase Filedata = Request.Files["file"];
 4             // 如果没有上传文件
 5             if (Filedata == null || string.IsNullOrEmpty(Filedata.FileName) || Filedata.ContentLength == 0)
 6             {
 7                 return this.HttpNotFound();
 8             }
 9             // 保存到 ~/img 文件夹中,名称不变
10             //string filename = System.IO.Path.GetFileName(Filedata.FileName);
11             string filename = GetImageName() + System.IO.Path.GetExtension(Filedata.FileName);
12             string virtualPath = string.Format("~/Image/NewsImg/{0}", filename);
13             // 文件系统不能使用虚拟路径
14             string path = this.Server.MapPath(virtualPath);
15             Filedata.SaveAs(path);
16             return Json("/Image/NewsImg/" + filename);
17         }

参考博客: http://blog.csdn.net/shenyingkui/article/details/45692167

posted @ 2017-10-12 20:07  不吃沙琪玛  阅读(601)  评论(0编辑  收藏  举报