• 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

  • 相关阅读:
    vue指令参考
    jquery easyui 研究(一)Datagrid初始化设置
    HTML之响应协议
    HTTP协议之请求协议
    HTTP协议之HTTP概述
    Day18_函数定义_形参_实参_可变参数
    Day19_名称空间和作用域_函数的嵌套_函数第一类对象的使用_闭包函数
    跳转语句 break 和 continue
    JS中强制类型转换
    toString
  • 原文地址:https://www.cnblogs.com/lql6/p/7657834.html
Copyright © 2020-2023  润新知