Kendo UI FileUpload 通过 AJAX 和 JSON

Question

我在 MVC 5 中使用 Kendo。我有几个表单输入，包括一个文件上传控件。单击按钮我正在构建一个带有输入值的 json 对象，并通过 AJAX 调用发送它。

我想知道如何在发送的 json 对象中包含从文件上传控件中选择的文件。这是上传控件的代码：

$(document).ready(function () {
    $("#files").kendoUpload({
        multiple: false
    });
});

然后ajax调用发送表单数据：

var ro = new Object();
// ...... //populate some properties      
var jsonString = JSON.stringify(ro);

$.ajax({
    url: '@Url.Action("Save", "Service")',
    data: jsonString ,
    type: 'POST',
    dataType: 'json',
    contentType: 'application/json',
});

接收控制器动作如下所示：

public ActionResult Save(MyViewModel model)
{
    var obj = //call something here then return resulting obj 
    return this.Json(obj, JsonRequestBehavior.AllowGet);
}  

感谢任何帮助。

Answer 1

试试

 $("#files").kendoUpload({
            multiple: false,
            async: {
                saveUrl: '@Url.Action("Save", "Service")',
                autoUpload: true
            },
            upload: function (e) {
                var ro = new Object();
                //......//populate some properties      

                var jsonString = JSON.stringify(ro);
                e.data = jsonString;
            }
        });

在您的控制器中：

public ActionResult Save(IEnumerable<HttpPostedFileBase> files, string model) 
            // string because you used JSON.stringify and it is a string, do not stringify, if you need an object
        {
            var js = new JavaScriptSerializer();
            var objetModel = js.Deserialize<MyViewModel>(model);            

            var obj = //call something here then return resulting obj 

            return Json(obj, JsonRequestBehavior.AllowGet);

        }

我没有测试它 - 这只是为了让您了解如何将附加信息与上传的二进制文件一起传递