文件上传使用最近的Bootstrap文件上传和mvc asp.net

时间:2014-03-24 21:29:28

标签: asp.net-mvc twitter-bootstrap

我查看了其他一些答案,但那里的解决方案没有用。而我似乎无法弄清楚原因。这是使用Bootstrap 3.0。我所要做的就是使用它来上传新的头像图像。问题是它总是出现空的,我似乎无法弄清楚原因。

这是我的HTML:

@using (Html.BeginForm("EditAvatar", "Profile", new { userID = @Model.ProPit_User.userID }, FormMethod.Post, new { }))
{
    <div class="form-group">
        <div class="fileinput fileinput-new" data-provides="fileinput">
            <div class="fileinput-new thumbnail" style="width: 200px; height: 150px;">
                <img src="http://www.placehold.it/200x150/EFEFEF/AAAAAA&amp;text=no+image" alt="" />
            </div>
            <div class="fileinput-preview fileinput-exists thumbnail" style="max-width: 200px; max-height: 150px;">
            </div>
            <div>
                <span class="btn default btn-file">
                    <span class="fileinput-new">Select image
                    </span>
                    <span class="fileinput-exists">Change
                    </span>
                    <input id="avatar_image" type="file" name="..." runat="server">
                </span>
                <a href="#" class="btn default fileinput-exists" data-dismiss="fileinput">Remove
                </a>
            </div>
        </div>
        <div class="clearfix margin-top-10">
            <span class="label label-danger">NOTE!
            </span>
            <span>Attached image thumbnail is supported in Latest Firefox, Chrome, Opera, Safari and Internet Explorer 10 only
            </span>
        </div>
    </div>
    <div class="margin-top-10">
        <button type="submit" class="btn green">
            Save Changes
        </button>
        <button type="reset" class="btn default">Cancel</button>
    </div>
}

我已经为文件输入了avatar_image

的ID

这是控制器:

[HttpPost]
        public ActionResult EditAvatar(HtmlInputFile avatar_image)
        {

            if (avatar_image.PostedFile != null)
            {
                //do whatever you want with the file
            }

            return View();
        }

当查看断点时,avatar_image.PostedFile始终为null。任何人都知道我错过了什么?

1 个答案:

答案 0 :(得分:3)

您可以在Fiddler中查看请求。更重要的是,您需要添加enctype =&#34; multipart / form-data&#34;属性为表格。