Question

我有一个上传视图，需要用来上传三个附件。现在我将此代码用于视图中的UI部分：

   <div id="theDeliveryNoteContent">
     <form action='Order/Save' method="post" enctype="multipart/form-data" id="deliveryNoteForm">
        <div >
            <label style="text-align: left;">Delivery note:</label>
            <input type="file" name="DeliveryNoteFile" id="DeliveryNote" style="width: 400px;" />     
            <div style="margin-top:4px;margin-bottom:4px"   >      
               <input type="submit" value="Upload" id="btnAddAttachment" />
            </div>
        </div>               
    </form>
</div>

现在我要调用的方法位于我的Orders控制器中。这是我正在使用的方法。代码工作正常，直到返回部分。

  [HttpPost]
    public ActionResult Save(HttpPostedFileBase DeliveryNoteFile)
    {
        try
        {
            string customer = GetCustomerLinkedToPortalUser();
            var uploadPath = "C:\\Attachments\\" + customer;
            if (!Directory.Exists(uploadPath))
            {
                Directory.CreateDirectory(uploadPath);
            }
            if (DeliveryNoteFile != null)
            {

                var fileName = Path.GetFileName(DeliveryNoteFile.FileName);
                var physicalPath = Path.Combine(uploadPath, fileName);
                DeliveryNoteFile.SaveAs(physicalPath);
            }
            return RedirectToAction("Index");
        }
        catch (Exception)
        {

            throw;
        }

    }

问题是，当方法返回到屏幕时，它会刷新屏幕并且所有输入的信息都将丢失。我想将文件保存到该目录并返回订单屏幕并上传下一个文件。现在我应该怎么做，我不确定这是我需要帮助的。

一位同事提到我可以使用jQuery.Form脚本进行ajax调用，所以我做的是将jquery.form.js脚本添加到我的项目中，进行了引用，我还将其添加到我的javascript：< / p>

   $("#deliveryNoteForm").ajaxForm({
        target: "#theDeliveryNoteContent"
    });

所以现在它返回到我的屏幕，但它会弄乱布局并刷新屏幕（似乎）无论如何。有没有其他简单的方法可以使用我使用的方法返回上一个屏幕，而不会丢失所有输入的信息？

Answer 1

您需要异步文件上传。使用this。阅读一些文档很简单。

示例：

Javascript初始化：

$(function () {
    $('#DeliveryNote').fileupload({
        dataType: 'json',
        done: function (e, data) {
            $.each(data.result.files, function (index, file) {
                $('<p/>').text(file.name).appendTo(document.body);
            });
        }
    });
});

HTML：

<input id="DeliveryNoteFile" type="file" name="files[]" data-url="yourUploadController/Save/" style="width: 400px;" />

并删除提交按钮。

jquery没有刷新屏幕返回到同一屏幕

1 个答案: