Summernote回调图片上传完成，但Form再次提交post请求文件

Posted 2023-03-22

【中文标题】Summernote回调图片上传完成，但Form再次提交post请求文件

【英文标题】：Summernote callback Image Upload complete, But Form submit post request file again

【发布时间】：2019-09-01 21:21:50

【问题描述】：

当我在summernote中更新文件图像时，我使用回调更新图像。没关系。 但是我提交表单，文件在请求中再次发送，我想提交表单而不是再次发送文件。

    $('.textarea-editor').summernote(
        height: 300, // set editor height
        minHeight: null, // set minimum height of editor
        maxHeight: null, // set maximum height of editor
        focus: true, // set focus to editable area after initializing summernote
        callbacks: 
            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: "/Image/Upload",
            cache: false,
            contentType: false,
            processData: false,
            success: function (url) 
                $('.textarea-editor').summernote('editor.insertImage', url);
                //editor.insertImage(welEditable, url);
            
        );
    

【参考方案1】：

请试试这个解决方案：

    // onImageUpload callback
$('.textarea-editor').summernote(
  callbacks: 
    onImageUpload: function(files) 
      // upload image to server and create imgNode...
      $summernote.summernote('insertNode', imgNode);
    
  
);

// summernote.image.upload
$('.textarea-editor').on('summernote.image.upload', function(we, files) 
 data = new FormData();
        data.append("file", files);
        $.ajax(
            data: data,
            type: "POST",
            url: "/Image/Upload",
            cache: false,
            contentType: false,
            processData: false,
            success: function (url) 
               $summernote.summernote('insertNode', url);
            
        );

);

文档：https://summernote.org/deep-dive/#onimageupload

【讨论】：

谢谢你的回答，我回拨成功。我的问题是当我提交表单时，文件上传被再次发送。

【参考方案2】：

从您的表单标签中删除 enctype="multipart/form-data"