时间戳

首页 > 解决方案 > 无法从控制器中的 HTTP 方法获取回调

javascript - 无法从控制器中的 HTTP 方法获取回调

问题描述

我正忙于创建一个用于上传文件的等待指示器，但似乎我无法从控制器中触发的 POST 方法接收任何回调。我一直在寻找半天并尝试了很多不同的解决方案，但它们似乎都不适用于我的情况。

我有一个模型：

public class FileUploadModel
{
    [Required(ErrorMessage = "Select file(s) to upload.")]
    [Display(Name = "Browse")]
    public HttpPostedFileBase[] Files { get; set; }

    [Display(Name = "File Type")]
    public EFileType FileType{ get; set; }
}

我有一个表格：

@using (Html.BeginForm("FileExchange", "General", FormMethod.Post, new { enctype = "multipart/form-data", id = "uploadform" }))

控制器中的方法：

[HttpPost]
public async Task<ActionResult> FileExchange(FileUploadModel model)
{
    await UploadFiles(model);
    return View("FileExchange");
}

我在 javascript/ajax 中尝试了类似以下的内容：

<script>
    $(document).ready(function () {
        $("#preloader").hide(); //the wait indicator
        $('#uploadform').on('submit', function (e) {
            e.preventDefault();

            var formdata = new FormData($('#uploadform').get(0));

            $("#preloader").show();

            var url = '@Url.Content("~/General/FileExchange/")'
            //var dataModel = $(this).serialize();
            $.ajax({
                url: url,
                type: "POST",
                data: formdata,
                processData: false,
                contentType: false,
                //dataType: "json",
                success: function (resp) {
                    $("#preloader").hide();
                },
                error: function (resp) {
                    $("#preloader").hide();
                }
            });
        });
    })
</script>

等待指示器正在工作，但该方法没有受到影响。

当我将模型添加到“提交”功能时：

$('#uploadform').on('submit', model, function (e)

POST 方法被命中，但等待指示器停止工作。几乎似乎“提交”功能不再受到打击。

有关如何解决此问题的任何想法？

标签： javascriptc#ajaxrazormodel-view-controller

解决方案

我搜索了更长的时间，并找到了解决问题的方法：

<script type="text/javascript">
    $(document).ready(function () {
        $("#preloader").hide();
    })

    $('#uploadform').on('submit', function () {

        $("#preloader").show();

        $('#uploadform').ajaxForm({
            url: '@Url.Content("~/General/FileExchange")',
            dataType: 'json',
            success: function () {
                $("#preloader").hide();
            }
        })
    })
</script>

这样，我可以在触发“提交”时显示指示器，并在成功执行给定 URL 的 POST 方法时隐藏指示器。

推荐阅读