如何在MVC 5中获取Bootstrap文件输入数据到控制器

时间:2015-02-11 04:02:19

标签: javascript jquery asp.net-mvc twitter-bootstrap

我使用Bootstrap File Input插件在我的ASP.Net MVC 5申请表中上传图片。我不确定我需要在控制器上看到什么,或者我需要在javascript中做些什么才能让它工作。目前,当我以

的形式提交数据时,会出现错误
  

"输入不是有效的Base-64字符串,因为它包含非基本64个字符,两个以上的填充字符或填充字符中的非法字符。"

这是我的StudentController。

[HttpPost]
    public ActionResult Edit(EditStudentViewModel studentViewModel)
    {
        if (ModelState.IsValid)
        {
            ...other code left out

这是我的javascript

$("#input-20").fileinput({
'type': 'POST',
'cache': false,
'browseClass': 'btn btn-primary btn-block',
'showCaption': false,
'showRemove': false,
'showUpload': false,
'uploadAsync': false,
'maxFileCount': 1,
'allowedFileExtensions': ['jpg', 'png', 'gif'],
'allowedFileTypes': ['image']
'uploadUrl': '@Url.Action("Edit", "Student")'

});

*这些是正确的' uploadUrl'参数 这是我的表单,将数据提交给控制器。您可以看到我提交ViewModel中的内容以及图像。表示iamge的byte []位于视图模型中

@model YogaBandy.DomainClasses.ViewModels.Student.EditStudentViewModel

@{
ViewBag.Title = "Edit";
Layout = "~/Views/Shared/_Layout.cshtml";
}

@Html.Partial("_MenuPartial")

<div class="row submenurow">
    @Html.Partial("_StudentTeacherProfilePartial")
    <div class="col-md-9 submenucol2">
    @using (Html.BeginForm("Edit", "Student", new { ReturnUrl =    ViewBag.ReturnUrl }, FormMethod.Post, new { @class = "form-horizontal", role = "form" }))
    {
        @Html.AntiForgeryToken()
        @Html.HiddenFor(model => model.StudentId)
        @Html.HiddenFor(model => model.AspNetUserRefId)    
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })

        <div class="panel panel-default">
            <div class="panel-heading">
                <h3 class="panel-title">Student Picture</h3>
            </div>
            <div class="panel-body">
                @Html.TextBoxFor(model => model.TestImage, new { @type = "file", @id = "input-20" })
            </div>
        </div>
        <br/>
        <div class="panel panel-default">
            <div class="panel-heading">
                <h3 class="panel-title">Student Profile</h3>
            </div>
            <div class="panel-body">

                <div class="form-group">
                    @Html.LabelFor(model => model.CatchPhrase, htmlAttributes: new { @class = "control-label col-md-2" })
                    <div class="col-sm-10">
                        @Html.EditorFor(model => model.CatchPhrase, new { htmlAttributes = new { @class = "form-control" } })
                        @Html.ValidationMessageFor(model => model.CatchPhrase, "", new { @class = "text-danger" })
                    </div>
                </div>
                ...other form-group's left out below to save space  
            </div>
        </div>
        <br />
        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Save" class="btn btn-default" />
            </div>
        </div>
    }
</div>

这是我提交给控制器的ViewModel

public class EditStudentViewModel
{
    public byte[] TestImage { get; set; }
    ...other values left out
}

0 个答案:

没有答案