C# MVC 框架 图片上传（非layui） 及layui表格图片显示

1.视图 index （html）代码

			<div class="layui-form-item" style="margin-top:20px">
                <label class="layui-form-label">站点图片：</label>
                <div class="layui-input-block">
                    <input id="in_StationStationImage" name="StationImage" type="file" style="width: 180px" class="layui-input">
                </div>
            </div>`

2.js代码

   **//以下代码写在自己的确认添加按钮事件**
    var nodeData = data.field;
    var formData = new FormData();
    formData.append("AlarmName", $("#Add_AlarmName").val());
    formData.append("AlarmId", $("#Add_AlarmId").val());
    formData.append("DisplayOrder", $("#Add_DisplayOrder").val());
    formData.append("Memo", $("#Add_Memo").val());
    formData.append("StationImage", $("#in_StationStationImage")[0].files[0]);
    var json = Invoke_APINew("/LR_Alarm_Parameter/InvokeJS_LR_Alarmpara_InsertOrUpdate", formData);//后台方法
    if (json["result"]) {
        layer.msg('保存成功', { icon: 6 });
        layer.closeAll();
        LoadData();
    }
    else {
        layer.msg('保存失败', { icon: 5 });
        layer.closeAll();
    }
    return false;


    function Invoke_APINew(url, obj, synchro) {
        var json = {};
        if (!synchro) {
            synchro = false;
        }
        $.ajax({
            url: ".." + url,
            data: obj,
            type: "POST",
            async: synchro,
            dataType: "json",
            crossDomain: true,
            traditional: true,//参数里有数组时用true
            contentType: false,//使用formData是用到
            processData: false,//使用fromData时用到
            success: function (data) {
                json = data;
            },
            error: function (jqXHR, textStatus, errorThrown) {
                /*错误信息处理*/
                /*
                alert("进入error---");
                alert("状态码：" + jqXHR.status);
                alert("状态:" + jqXHR.readyState); //当前状态,0-未初始化，1-正在载入，2-已经载入，3-数据进行交互，4-完成。
                alert("错误信息:" + jqXHR.statusText);
                alert("返回响应信息：" + jqXHR.responseText); //这里是详细的信息
                alert("请求状态：" + textStatus);
                alert(errorThrown);
                alert("请求失败");*/
            }
        });
        return json;
    }
   
   

3.控制器

  public JObject InvokeJS_LR_Alarmpara_InsertOrUpdate(HttpPostedFileBase StationImage, string Id, string AlarmId, string AlarmName, string AlarmImg, string Memo, string DisplayOrder, string Border)
        {
            var model = new LR_AlarmparaModel();
            if (string.IsNullOrEmpty(Id))
            {
                model.Id = ProcessData_GetMaxId();
            }
            else
            {
                model.Id = Id;
            }
            if (StationImage != null)
            {
                string dir = "/Images/";
                //站点文件目录
                string fileDir = Server.MapPath(dir);
                string imgExtension = Path.GetExtension(StationImage.FileName);
                if (!Directory.Exists(fileDir))
                    Directory.CreateDirectory(fileDir);
                var img = "/Images/" + StationImage.FileName;
                StationImage.SaveAs(Path.Combine(fileDir, StationImage.FileName));//存储本地方法
                model.AlarmImg = img;
            }
            model.SystemId = USER.SystemID;
            model.AlarmId = AlarmId;
            model.AlarmName = AlarmName;
            model.DisplayOrder = DisplayOrder;
            model.Memo = Memo;
            var result = InvokeAPI_LR_Alarmpara_InsertOrUpdate(model);
            var json = new JObject();
            json["result"] = result;
            return json;
        }

4.layui表格显示

    { field: 'AlarmImg', title: '报警图片', templet: '<div><img src="{{ d.AlarmImg }}" style="width:30px; height:30px;">{{d.AlarmImg}}</div>' },  
     PS：必须用div包裹   d不用定义直接点出后台传的字段（AlarmImg）字段内容：/Images/1.jpg

效果图：