Explorar o código

update:uploadImgs采用ajax方式v1

lvzhiqiang hai 1 ano
pai
achega
c560ad6256

+ 1 - 1
src/main/java/top/lvzhiqiang/controller/CoinController.java

@@ -119,7 +119,7 @@ public class CoinController {
     @RequestMapping("/uploadImgs")
     @ResponseBody
     public R uploadImgs(@RequestParam("file") MultipartFile file, String remark) {
-        if (file == null) {
+        if (file == null || file.getSize() == 0) {
             throw new ParameterException("文件为空!");
         }
 

+ 5 - 2
src/main/resources/static/coin.html

@@ -72,6 +72,7 @@
     }
 
     .selected-value {
+        font-size: 13px;
         display: inline-block;
         padding: 0 0.5em;
         background: rgba(206, 205, 202, 0.5);
@@ -345,12 +346,14 @@
     <div style="display: flex;">
         <div style="margin-right:20px;">
             <span class="font">uploadImgs</span>
-            <form method="post" action="coin/uploadImgs" enctype="multipart/form-data">
+            <span id="uploadImgsAlert" style="margin-left: 10px;font-size: 13px;"></span>
+            <form method="post" action="coin/uploadImgs" enctype="multipart/form-data" onsubmit="return false;" id="uploadImgs">
                 <span>备注</span>
                 <input type="text" name="remark" placeholder="可为空"/>
                 <span>file</span>
                 <input type="file" name="file" multiple/>
-                <input type="submit" value="提交">
+                <input type="button" value="提交" onclick="uploadImgsSubmit()">
+                <input type="reset" value="重置">
             </form>
         </div>
     </div>

+ 29 - 0
src/main/resources/static/js/my-coin.js

@@ -518,4 +518,33 @@ function initContentEvent(nameEn) {
             });
         });
     }
+}
+
+function uploadImgsSubmit(){
+    var fromData = new FormData($("#uploadImgs")[0]);
+    $.ajax({
+        url: "coin/uploadImgs", //请求的url地址
+        dataType: "json", //返回格式为json
+        data: fromData, //参数值
+        type: "post", //请求方式
+        processData: false,// 告诉jQuery不要去处理发送的数据
+        contentType: false,// 告诉jQuery不要去设置Content-Type请求头
+        async: false, //请求是否异步,默认为异步,这也是ajax重要特性
+        success: function (data) {
+            //请求成功时处理
+            if (data != null && $.trim(data) != "" && data.success) {
+                $("#uploadImgsAlert").html(JSON.stringify(data.data));
+            } else {
+                $("#uploadImgsAlert").html(data.message);
+            }
+        },
+        beforeSend: function () {
+        },
+        complete: function () {
+        },
+        error: function (data) {
+            //请求出错处理
+            console.log("uploadImgs-submit error," + data);
+        }
+    });
 }