Question

我有一个类似于View中的上传机制：

 <div  method="post" enctype="multipart/form-data">
        <input type="hidden" id="ProjectId" name="ProjectId" value="@Model.ProjectId"/>
        <input type="hidden" id="Name" name="Name" value= "" />
        <input type="hidden" id="Id" name="Id" value="" />
        <div class="col-md-10">
            <div class="form-group">
                <input type="file" asp-for="InputFile"  value="test" name="inputfile" onchange="ChooseInputFileButtonChanged(this);" id="ChooseInputFile"/>
                <input type="submit" value="Upload" id="UploadInputFileButton" onclick="UploadInstallIntructions();"/>
            </div>
        </div>
    </div>

这是我的uploadinstructions（）方法，当用户按下“上传”按钮时会调用该方法。

script>
    function UploadInstallIntructions() {
        var name = document.getElementById('SoftwareVersionName').value;
        var id = document.getElementById("Id").value;
        var iFormFile = document.getElementById("ChooseInputFile").files[0];
        $.ajax({
            type: "POST",
            url: '@Url.Action("UploadInputFile", "SoftwareVersion")',
            data: { projectId: @Model.ProjectId, Name: name, Id: id, inputFile: iFormFile},
            cache: false,
            success: function (response) {
                window.location.href = response;
            }
        });
        return data;
    }
</script>

所以这是一个简单的ajax调用，它使用指定的参数调用我的控制器上的方法。我的问题是应该是IFormFile类型的文件数据的最后一个参数，以便我可以在我的控制器中使用它，不会被设置。有没有更好的方法可以在我的视图中绑定我的IFormFile对象？通常只是一行：

input type="file" asp-for="InputFile" value="test" name="inputfile" onchange="ChooseInputFileButtonChanged(this);" id="ChooseInputFile"/>

应该可以绑定IFormFile。

编辑：不是how to append whole set of model to formdata and obtain it in MVC的副本，因为我的问题不是与FormData绑定，而是自动从视图中创建IFormFile。

Answer 1

尝试以下代码：

    <form name="UpdateInstall" id="UpdateInstall" method="post" enctype="multipart/form-data">
        <input type="hidden" id="ProjectId" name="ProjectId" value="@Model.ProjectId"/>
        <input type="hidden" id="Name" name="Name" value= "" />
        <input type="hidden" id="Id" name="Id" value="" />
        <div class="col-md-10">
            <div class="form-group">
                <input type="file" asp-for="InputFile"  value="test" name="inputfile" onchange="ChooseInputFileButtonChanged(this);" id="ChooseInputFile"/>
                <input type="submit" value="Upload" id="UploadInputFileButton" onclick="UploadInstallIntructions();"/>
            </div>
        </div>
    </form>

        <script>
            function UploadInstallIntructions() {
                var formData = new FormData($("#UpdateInstall")[0]);
                $.ajax({
                    type: "POST",
                    url: '@Url.Action("UploadInputFile", "SoftwareVersion")',
                    data: formData,
                    processData: false,
                    contentType: false,
                    success: function (response) {
                        window.location.href = response;
                    }
                });
                return data;
            }
        </script>

Answer 2

上传完像这样的图像文件后..

$('input[type="file"]').ajaxfileupload({
    'action': 'uploadFile.jsp',
    'cache': false,
    'onComplete': function(response) {
        $('#upload').hide();
        BootstrapDialog.show({
            title: 'Alert!',
            message: 'Image Upload Successfully',
            buttons: [{
                label: 'Ok',
                action: function(dialog) {
                    dialog.close();
                }
            }]
        });

        var img_src = "../profilepic/" + response;
        setTimeout(5000);
        $("#image").attr("src", img_src);
    },
    'onStart': function() {
        $('#upload').show();
    }
});

<input type="file" name="datafile" accept="image/*"/><br/>
<div id="upload" style="display:none;">Uploading..</div>

如果您希望上传此类文件，请访问此链接 jQuery.AjaxFileUpload.js

无法从View的<input />标记获取/设置IFormFile对象

2 个答案: