Question

我正在使用asp.net mvc应用程序并尝试上传图片。

这是上传图片功能

$(document).ready(function () {

        TableDatatablesEditable.init();
        $("#UploadImg").change(function () {
            var data = new FormData();
            var files = $("#UploadImg").get(0).files;
            if (files.length > 0) {
                data.append("MyImages", files[0]);
            }

            $.ajax({
                url: "@Url.Action("UploadFile")",
                type: "POST",
                processData: false,
                contentType: false,
                data: data,
                success: function (response) {
                    $("#HeaderInput").text('/Upload/' + response);

                    $("#imgPreview").attr('src', '/Upload/' + response);
                },
                error: function (er) {
                    alert(er);
                }

            });
        });
    });

我在这里显示上传的图像

                @Html.Label("Logo Upload", new { @class = "col-md-3 control-label" })

                <div class="col-md-7">
                    <input type="file" class = "col-md-3 control-label" id="UploadImg" value="@Model.FundDetail.ImagePath" name="@Model.FundDetail.ImagePath" /> <br /><br />                           
                    <br />                   
                </div>
            </div>

图片上传工作正常，但值未分配给模型的属性"@Model.FundDetail.ImagePath"

如何从javascript中分配值。任何人都可以建议我如何做到这一点。

提前致谢

Answer 1

出于安全原因，您无法设置文件输入的deleteGlobalValue属性。可以设置的唯一方法是用户在浏览器中选择文件。

在表单中，包含文件名的隐藏输入

value

并将文件输入更改为

@Html.HiddenFor(m => m.FundDetail.ImagePath)

然后在上传文件并返回保存路径的ajax调用中，更新成功回调中隐藏输入的值

<input type="file" class = "col-md-3 control-label" id="UploadImg" />

现在，当您提交表单时，$.ajax({ .... success: function (response) { $("#HeaderInput").text('/Upload/' + response); $("#imgPreview").attr('src', '/Upload/' + response); // Set the value of the hidden input $('#FundDetail_ImagePath').val(response); }, .... });属性将填充文件的已保存路径，然后可以将其保存到数据库中。

将JavaScript值分配给mvc model属性

1 个答案: