zoukankan      html  css  js  c++  java
  • Dapper上传图片

    <h2>添加商品</h2>

    <table class="table table-bordered">
    <tr>
    <td>商品名称:</td>
    <td><input id="name" type="text" /></td>
    </tr>
    <tr>
    <td>商品图片:</td>
    <td><input type="file" id="f1" /></td>
    <td><input type="button" value="aa" onclick="ff()" /></td>
    </tr>
    <tr>
    <td>商品颜色:</td>
    <td><input id="color" type="text" /></td>
    </tr>
    <tr>
    <td>商品尺码:</td>
    <td><input id="size" type="text" /></td>
    </tr>
    <tr>
    <td>商品价格:</td>
    <td><input id="price" type="text" /></td>
    </tr>
    <tr>
    <td><input id="Button1" type="button" value="添加" onclick="add()" /></td>
    <td></td>
    </tr>
    </table>

    <script>

    //上传文件
    var url = []; //图片路径
    function ff() {
    var formData = new FormData();
    var file = document.getElementById("f1").files[0];
    formData.append("fileInfo", file);
    $.ajax({
    url: "http://localhost:51518/api/Shop/UpLoad",
    type: "post",
    data: formData,
    contentType: false,//必须false才会自动加上正确的Content-Type
    processData: false,//必须false才会避开jQuery对 formdata 的默认处理,XMLHttpRequest会对 formdata 进行正确的处理
    success: function (data) {
    if (data.Code == 0) {
    alert(data.Msg);
    //保存图片路径
    url = (data.Url).split(";");
    }
    else {
    alert('上传失败!');
    }
    }
    })
    }

    //添加商品
    function add() {
    var obj = {
    GName: $("#name").val(),
    GImg: url[0],
    GColor: $("#color").val(),
    GSize: $("#size").val(),
    GPrice: $("#price").val()
    };
    $.ajax({
    url: "http://localhost:51518/api/Shop/AddGood",
    data: obj,
    type: "post",
    dataType: "json",
    success:
    function (d) {
    if (d > 0) {
    alert('添加成功!');
    location.href = "/Default/ShowGood";
    }
    else {
    alert('添加失败!');
    }
    }
    })
    }
    </script>

  • 相关阅读:
    linux 内核升级4.19
    监管对保险页面的要求
    软件测试-测试可交付成果
    软件测试架构思想
    dockerfile
    转载:.NET Core 图片操作在 Linux/Docker 下的坑
    docker build速度过慢问题
    .net 5 发布到 docker 或 docker 镜像方法
    Centos 安装 docker 教程
    DQL、DML、DDL、DCL全名是啥?
  • 原文地址:https://www.cnblogs.com/CoreColor/p/13448772.html
Copyright © 2011-2022 走看看