剑道UI在网格内上传



我正在尝试在网格内使用剑道上传实现剑道UI网格。当我使用 ASP.NET MVC时,我没有使用Telerik MVC包装器。我试图在没有他们的情况下做到这一点。

我遇到的问题是IEnumerable HttpPostedFileBase在回发到我的Action方法时为空。

JavaScript:

$(document).ready(function () {
        var dsGalleryItemFile = new kendo.data.DataSource({
            transport: {
                read:   "@Url.Content("~/Intranet/GalleryItemFile/ListFiles/")@Model.galleryItemID",
                update: {
                    url: "@Url.Content("~/Intranet/GalleryItemFile/UpdateFile")",
                    type: "POST"
                },
                destroy: {
                    url: "@Url.Content("~/Intranet/GalleryItemFile/DeleteFile")",
                    type: "POST"
                },
                create: {
                    url: "@Url.Content("~/Intranet/GalleryItemFile/CreateFile/")@Model.galleryItemID",
                    type: "POST"
                }
            },
            // determines if changes will be send to the server individually or as batch
            batch: false,
            schema: {
                model: {
                    id: "fileID",
                    fields: {
                        fileID: {
                            editable: false,
                            nullable: true
                        },
                        filename: {},
                        fileType: { defaultValue: {fileTypeID: 1, fileType: "Web JPEG"} },
                        fileType: {},
                        width: { type: "number" },
                        height: { type: "number" },
                        }
                    }
                }
        });
        $("#gvGalleryItemFile").kendoGrid({
            columns: [{
                field: "filename",
                title: "Filename" 
            }, {
                field: "filepath",
                title: "File Upload",
                editor: fileUploadEditor//,
                //template: "<img src='#=filepath.filepath#' />"
            }, {
                field: "fileType",
                title: "File Type",
                editor: fileTypeDropDownEditor,
                template: "#=fileType.fileType#",
            }, {
                field: "width",
                title: "Width"
            }, {
                field: "height",
                title: "Height"
            }, {
                command: ["edit", "destroy"]
            }],
            editable: { mode: "inline" },
            toolbar: ["create"],
            dataSource: dsGalleryItemFile
        });

    });
    function fileTypeDropDownEditor(container, options) {
        $('<input required data-text-field="fileType" data-value-field="fileTypeID" data-bind="value:' + options.field + '"/>')
            .appendTo(container)
            .kendoDropDownList({
                autoBind: false,
                dataSource: {
                    transport: {
                        read: "@Url.Content("~/Intranet/FileType/ListFileTypes")"
                    }
                }
            });
    }
    function fileUploadEditor(container, options) {
        $('<input type="file" name="fileUpload" id="fileUpload" />')
            .appendTo(container)
            .kendoUpload({
                async: {
                    saveUrl: "@Url.Content("~/Intranet/GalleryItemFile/UploadFile")"
                },
                complete: onUploadComplete
            });
    }

MVC 操作:

[HttpPost]
    public ActionResult UploadFile(IEnumerable<HttpPostedFileBase> uploadedFiles)
    {
        if (uploadedFiles != null)
        {
            foreach (var thisFile in uploadedFiles)
            {
                string newFileName = Path.GetFileName(thisFile.FileName).Replace(" ", "");
                var physicalPath = Path.Combine(Server.MapPath("~/Areas/Gallery/Content/GalleryImages"), newFileName);
                thisFile.SaveAs(physicalPath);
            }
            return Content("");
        }
        else
        {
            return Content("Error");
        }
    }
尝试在

操作方法签名中命名参数参数,其方式与转换为上传小部件的输入的 name 属性相同。

在您的情况下

public ActionResult UploadFile(IEnumerable<HttpPostedFileBase> fileUpload)

相关内容

  • 没有找到相关文章

最新更新