<İnput type = "file" /> için HTML yardımcısı


124

HTMLHelperDosya yüklemek için var mı ? Özellikle, bir değiştirmeyi arıyorum

<input type="file"/>

ASP.NET MVC HTMLHelper kullanarak.

Veya kullanırsam

using (Html.BeginForm()) 

Dosya yüklemesi için HTML kontrolü nedir?

Yanıtlar:


207

HTML Yükleme Dosyası ASP MVC 3.

Model : ( FileExtensionsAttribute'un MvcFutures'da mevcut olduğunu unutmayın. Dosya uzantılarını istemci tarafında ve sunucu tarafında doğrular. )

public class ViewModel
{
    [Required, Microsoft.Web.Mvc.FileExtensions(Extensions = "csv", 
             ErrorMessage = "Specify a CSV file. (Comma-separated values)")]
    public HttpPostedFileBase File { get; set; }
}

HTML Görünümü :

@using (Html.BeginForm("Action", "Controller", FormMethod.Post, new 
                                       { enctype = "multipart/form-data" }))
{
    @Html.TextBoxFor(m => m.File, new { type = "file" })
    @Html.ValidationMessageFor(m => m.File)
}

Denetleyici eylemi :

[HttpPost]
public ActionResult Action(ViewModel model)
{
    if (ModelState.IsValid)
    {
        // Use your file here
        using (MemoryStream memoryStream = new MemoryStream())
        {
            model.File.InputStream.CopyTo(memoryStream);
        }
    }
}

Bu bir dosya girişi değil <input type="file" />, sadece bir metin kutusu
Ben

@PauliusZaliaduon, Microsoft.Web.Mvc.FileExtensions satırıyla birlikte MVC'nin altı kırmızı olarak çizilir. Bunu nasıl düzeltirim?
Pomster 04

1
@pommy FileExtensionsAttribute'un MvcFutures'da (MVC3 itibariyle) mevcut olduğunu unutmayın. Kaynakları buradan kullanabilirsiniz: Kaynaklar veya .NET Framework
4.5'te

1
Ne yazık ki, FileExtension özniteliği HttpPostedFileBase türü özelliklerle çalışmıyor gibi görünüyor, bunun yerine yalnızca dize görünüyor. En azından pdf'yi geçerli bir uzantı olarak kabul etmedi.
Serj Sagan

Bu, geçerli HTML5 olarak doğrulanmayan bir değer özelliği (value = "") ekler. değer girdi türleri dosya ve görüntü üzerinde geçerli değildir. Value özelliğini kaldırmanın herhangi bir yolunu görmüyorum. Sabit kodlanmış gibi görünüyor.
Dan Friedman

19

Ayrıca kullanabilirsiniz:

@using (Html.BeginForm("Upload", "File", FormMethod.Post, new { enctype = "multipart/form-data" }))
{ 
    <p>
        <input type="file" id="fileUpload" name="fileUpload" size="23" />
    </p>
    <p>
        <input type="submit" value="Upload file" /></p> 
}


6

Ya da düzgün bir şekilde yapabilirsin:

HtmlHelper Extension sınıfınızda:

public static MvcHtmlString FileFor<TModel, TProperty>(this HtmlHelper<TModel> helper, Expression<Func<TModel, TProperty>> expression)
    {
        return helper.FileFor(expression, null);
    }

public static MvcHtmlString FileFor<TModel, TProperty>(this HtmlHelper<TModel> helper, Expression<Func<TModel, TProperty>> expression, object htmlAttributes)
    {
        var builder = new TagBuilder("input");

        var id = helper.ViewContext.ViewData.TemplateInfo.GetFullHtmlFieldName(ExpressionHelper.GetExpressionText(expression));
        builder.GenerateId(id);
        builder.MergeAttribute("name", id);
        builder.MergeAttribute("type", "file");

        builder.MergeAttributes(new RouteValueDictionary(htmlAttributes));

        // Render tag
        return MvcHtmlString.Create(builder.ToString(TagRenderMode.SelfClosing));
    }

Bu hat:

var id = helper.ViewContext.ViewData.TemplateInfo.GetFullHtmlFieldName(ExpressionHelper.GetExpressionText(expression));

Listelerde ve diğer şeylerde bildiğiniz modele özgü bir kimlik oluşturur. model [0]. İsim vb.

Modelde doğru mülkü oluşturun:

public HttpPostedFileBase NewFile { get; set; }

Ardından, formunuzun dosya göndereceğinden emin olmanız gerekir:

@using (Html.BeginForm("Action", "Controller", FormMethod.Post, new { enctype = "multipart/form-data" }))

O zaman işte yardımcınız:

@Html.FileFor(x => x.NewFile)

Bu çözüm daha çok göze hitap ediyor ve @ Html yardımcı yöntemleriyle tutarlı olmamı sağlıyor.
Yahfoufi

4

Paulius Zaliaduonis'in cevabının geliştirilmiş versiyonu:

Doğrulamanın düzgün çalışmasını sağlamak için Modeli şu şekilde değiştirmem gerekiyordu:

public class ViewModel
{
      public HttpPostedFileBase File { get; set; }

        [Required(ErrorMessage="A header image is required"), FileExtensions(ErrorMessage = "Please upload an image file.")]
        public string FileName
        {
            get
            {
                if (File != null)
                    return File.FileName;
                else
                    return String.Empty;
            }
        }
}

ve görünüm:

@using (Html.BeginForm("Action", "Controller", FormMethod.Post, new 
                                       { enctype = "multipart/form-data" }))
{
    @Html.TextBoxFor(m => m.File, new { type = "file" })
    @Html.ValidationMessageFor(m => m.FileName)
}

@Serj Sagan'ın sadece dizelerle çalışan FileExtension özelliği hakkında yazdıkları için bu gereklidir.


Bu yanıtı Paulius'un cevabıyla birleştiremez misin?
Graviton

2

Kullanmak için BeginForm, işte kullanmanın yolu:

 using(Html.BeginForm("uploadfiles", 
"home", FormMethod.POST, new Dictionary<string, object>(){{"type", "file"}})

2
Önce bir girdi elemanının nasıl üretileceğinden bahsediyorsunuz ve şimdi de bir form elemanının nasıl üretileceğinden bahsediyorsunuz? Cevabın gerçekten bu mu?
pupeno

0

Bu aynı zamanda çalışır:

Model:

public class ViewModel
{         
    public HttpPostedFileBase File{ get; set; }
}

Görünüm:

@using (Html.BeginForm("Action", "Controller", FormMethod.Post, new 
                                       { enctype = "multipart/form-data" }))
{
    @Html.TextBoxFor(m => m.File, new { type = "file" })       
}

Denetleyici eylemi:

[HttpPost]
public ActionResult Action(ViewModel model)
{
    if (ModelState.IsValid)
    {
        var postedFile = Request.Files["File"];

       // now you can get and validate the file type:
        var isFileSupported= IsFileSupported(postedFile);

    }
}

public bool IsFileSupported(HttpPostedFileBase file)
            {
                var isSupported = false;

                switch (file.ContentType)
                {

                    case ("image/gif"):
                        isSupported = true;
                        break;

                    case ("image/jpeg"):
                        isSupported = true;
                        break;

                    case ("image/png"):
                        isSupported = true;
                        break;


                    case ("audio/mp3"):  
                        isSupported = true;
                        break;

                    case ("audio/wav"):  
                        isSupported = true;
                        break;                                 
                }

                return isSupported;
            }

İçerik listesi


-2

Bu biraz zor sanırım, ancak doğru doğrulama özelliklerinin uygulanmasına neden oluyor

@Html.Raw(Html.TextBoxFor(m => m.File).ToHtmlString().Replace("type=\"text\"", "type=\"file\""))
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.