2

我想在用户提交之前验证通过 Ajax 上传的文件。我确保它是 javascript 中的 .txt 或 .csv，然后我想调用我的控制器来验证它是否符合我们的 CSV 标准。

我有 ：

 <input type="file" name="csvFile" id="csvFile" onchange="validateFile()"/>

和

function validateFile() {
    var file = document.getElementById("csvFile");
    var extension = file.value.split('.').pop();

    if (extension != "csv" && extension != "txt") {
        alert("A .csv or .txt file is required for upload");
        return false;
    }

    $.ajax({
        url: '@Url.Action( "ValidateCSV","UploadCSV")',
        type: "POST",
        data: { file: document.getElementById("csvFile") }, //unclear here

        success: function () {
            alert("success");
        },

        error: function (error) {
            alert("failed:" + error);
        }
    });
}

对于 ajax 数据，我如何HttpPostedFileBase从文件中获取控制器想要的数据？我想在允许用户提交之前进行所有验证。我不是 100% 我被“允许”这样做

谢谢你的任何指导

4

2 回答 2

1

您是否尝试将输入放入表单中？ 

<form action="" method="post" enctype="multipart/form-data">           
<input type="file" name="csvFile" id="csvFile" class="file" onchange="changeFile();validFile();" />
<div class="fakefile">
    <input id="csvFileFakeId" />
    <button onclick="return false;" class="blue">Browse</button>
</div>
<button type="submit">Upload</button>

</form>

验证文件类型，如果无效，清除输入并提醒用户。

<script type="text/javascript">
   var fileId = "csvFile";
   var fakeFileId = "csvFileFakeId";

   function changeFile() {
       var value = $("#" + fileId).val().split('\\').pop();
        $("#" + fakeFileId).val(value);
    };

    function validateFile() {
        var file = document.getElementById("csvFile");
        var extension = file.value.split('.').pop();

        if (extension != "csv" && extension != "txt") {
            alert("A .csv or .txt file is required for upload");
            $('#csvFile').val('');
            $('#csvFileFakeId').val('');
            return false;
        }
    };
</script>

并且当发布表单时（这假设 MVC 端点是Upload或者您已经映射了该路径

[HttpPost]
public ActionResult Upload(HttpPostedFileBase file)
{
    ....
}
于 2013-08-21T15:59:34.003 回答
0

我在这里有一个使用 HTML5 文件 api 的答案。在 ASP.NET MVC 站点中使用 jQuery 对话框上传照片

它被否决了，但我总是用它来上传并且它有效。

于 2013-08-21T15:51:04.910 回答