locked
Summernote Image Upload with ASP.NET Web Pages RRS feed

  • Question

  • User1935446700 posted
    @{
        Layout = "~/Admin/_DashboardLayout.cshtml";
        Page.Title = "Add Post";
    
        var fileName = "";
        if (IsPost) {
            var fileSavePath = "";
            var uploadedFile = Request.Files[0];
            fileName = Path.GetFileName(uploadedFile.FileName);
            fileSavePath = Server.MapPath("~/Images/" +
              fileName);
            uploadedFile.SaveAs(fileSavePath);
        }
    }
    
    <script>        
            $(document).ready(function() {
              $('#summernote').summernote({
                    height: 300, 
                    minHeight: null, 
                    maxHeight: null, 
                    focus: true,
                    onImageUpload: function(files, editor, welEditable) {                    
                        sendFile(files[0], editor, welEditable);
                    }                              
              });
              function sendFile(file, editor, welEditable) {              
                    data = new FormData();
                    data.append("file", file);
                    $.ajax({
                        data: data,
                        type: "POST",
                        url: 'AddPost.cshtml',                    
                        cache: false,
                        contentType: false,
                        processData: false,
                        success: function(url) {
                            editor.insertImage(welEditable, url);
                        }
                    });
                }                 
            });    
    </script>   

    Image uploading operation is successful but I can't see the uploaded image in summernote editor.

    Saturday, November 7, 2015 4:55 AM

Answers

  • User-1903621820 posted

    You must return absolute path of the image.

    return     @"/Content/img/" + file.FileName ;

    // POST api/<controller>
    public string Post()
    {
        var request = HttpContext.Current.Request;
        
        foreach (var fn in request.Files.AllKeys)
        {
            HttpPostedFile file = request.Files[fn];
            var filePath = @"D:\\" + file.FileName;
            using (var fs = new System.IO.FileStream(filePath, System.IO.FileMode.Create))
            {
                file.InputStream.CopyTo(fs);
            }
            return     @"/Content/img/" + file.FileName ;
        }
        return "";
    }
    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, November 17, 2015 9:53 AM