0

我有两个问题:

1.) 我已经将 Fine Uploader 放在一个表单中,现在我想知道为什么我在控制器中看不到输入字段的填充内容。我该如何解决?

2.) 如何在上传过程触发之前进行字段验证?

我希望有人能帮帮忙!

这是我的代码:

模型:

public class UploadFileModel
{
    [StringLength(100)]
    [Display(Name = "* Title:")]
    public string Title { get; set; }

    [StringLength(300)]
    [Display(Name = "Description:")]
    public string Description { get; set; }
}

看法:

@model mowee.Models.UploadFileModel

<link href="~/Scripts/fineuploader/fineuploader-3.5.0.css" rel="stylesheet" />

@using (Html.BeginForm("UploadFile", "Home", FormMethod.Post, new { id = "uploadForm", enctype = "multipart/form-data" }))
{
    @Html.AntiForgeryToken()
    @Html.ValidationSummary()

    <fieldset>
        <legend>Video Upload</legend>
        <ol>
            <li>
                @Html.LabelFor(m => m.Title)
                @Html.TextBoxFor(m => m.Title, new { @Class = "action add", title = "Enter your video/movie title here." })
            </li>
            <li>
                @Html.LabelFor(m => m.Description)
                @Html.TextAreaFor(m => m.Description, new Dictionary<string, object> { { "rows", "3" } })
            </li>
        </ol>

        <div id="bootstrapped-fine-uploader"></div>
        <script src="~/Scripts/fineuploader/fineuploader-3.5.0.js"></script>
        <script>
            function createUploader() {
                var uploader = new qq.FineUploader({
                    element: document.getElementById('bootstrapped-fine-uploader'),

                    multiple: false,
                    validation: {
                        sizeLimit: 2147483648 //2GB
                    },
                    request: {
                        endpoint: '/Home/UploadFile'
                    },
                    text: {
                        uploadButton: '<div><i class="icon-upload icon-white"></i>* Upload Video</div>'
                    },
                    template: '<div class="qq-uploader span12">' +
                    '<pre class="qq-upload-drop-area span12"><span>{dragZoneText}</span></pre>' +
                    '<div id="btnUpload" class="qq-upload-button btn btn-success" style="width: 33%;">{uploadButtonText}</div>' +
                    '<span class="qq-drop-processing"><span>{dropProcessingText}</span><span class="qq-drop-processing-spinner"></span></span>' +
                    '<ul class="qq-upload-list" style="margin-top: 10px; text-align: center;"></ul>' +
                    '</div>',
                    classes: {
                        success: 'alert alert-success',
                        fail: 'alert alert-error',
                        dropActive: "cssClassToAddToDropZoneOnEnter"
                    }
                });
            }
            window.onload = createUploader;
        </script>
    </fieldset>
}

控制器:

[HttpPost]
[AllowAnonymous]
[AcceptVerbs(HttpVerbs.Post)]
public JsonResult UploadFile(string qqfile, UploadFileModel myModel)
{
    if (ModelState.IsValid)
    {
        try
        {
            HttpPostedFileBase uploadFile = null;
            uploadFile = Request.Files[0];

            if (uploadFile != null && uploadFile.ContentLength > 0)
            {
                if (myModel.Title != null || myModel.Description != null)
                {
                   **//but UploadFileModel is null. WHY??????? Anyone an idea what i did wrong???
                   //write data to DB**
                }
            }
            else
            {
                ModelState.AddModelError("", "Please choose a video/movie.");
                return Json(new { success = false, message = "Please choose a video/movie." }, "application/json");
            }
        }
        catch (Exception ex)
        {
            ModelState.AddModelError("", "An error occured. Try again.");
            mailUtils.SendBugMail(ex, this.HttpContext);
            return Json(new { success = false, message = "An error occured during upload. Try again." }, "application/json");
        }
        return Json(new { success = true, VideoLink = @ViewBag.VideoLink, VideoTranscoded = @ViewBag.Transcoded }, "application/json");//"text/html");
    }
    return Json(new { success = false, message = "An error occured during upload. Try again." }, "application/json");
}
4

2 回答 2

1

好的。我想到了。可以使用 setParams 在回调“onSubmit”上设置参数,如下所示:

                callbacks: {
                    onSubmit: function (id, fileName, responseJSON) {
                        uploader.setParams({
                            idxTitle: $('#titleId').val(),
                            idxAuthor: $('#authorId').val(),
                            idxEmail: $('#emailId').val()
                        });
                    },

它工作正常!

于 2013-05-08T08:22:00.447 回答
0

解决您的问题:

  1. 您真的应该看看Fine Uploader 服务器端示例存储库中的MVC4 示例。在这个例子之后为你的服务器端代码建模,你应该没问题。我个人不是 MVC4 开发人员,但我知道我链接到的示例有效。
  2. 您可以使用onValidateonValidateBatch回调来执行您自己的验证任务。请查看回调文档以获取更多信息。
于 2013-05-07T15:18:24.303 回答