Помощник HTML для <input type = "file" />

Есть ли HTMLHelper для загрузки файлов? В частности, я ищу замену

<input type = "file"/>

с использованием ASP.NET MVC HTMLHelper.

Или, если я использую

using (Html.BeginForm()) 

Что такое элемент управления HTML для загрузки файла?

Стоит ли изучать PHP в 2026-2027 годах?
Стоит ли изучать PHP в 2026-2027 годах?
Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Приемы CSS-макетирования - floats и Flexbox
Приемы CSS-макетирования - floats и Flexbox
Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Пользовательский скаляр GraphQL
Пользовательский скаляр GraphQL
Листовые узлы системы типов GraphQL называются скалярами. Достигнув скалярного типа, невозможно спуститься дальше по иерархии типов. Скалярный тип...
128
0
163 957
8
Перейти к ответу Данный вопрос помечен как решенный

Ответы 8

Некоторое время назад у меня был такой же вопрос, и я наткнулся на один из постов Скотта Хансельмана:

Реализация загрузки файлов HTTP с помощью ASP.NET MVC, включая тесты и макеты

Надеюсь это поможет.

Спасибо, но я специально ищу реализацию использования (Html.BeginForm ()), а не других вариантов.

Graviton 20.11.2008 18:28

Чтобы использовать BeginForm, вот способ его использования:

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

Сначала вы упоминаете, как сгенерировать элемент ввода, а теперь говорите о том, как сгенерировать элемент формы? Это действительно твой ответ?

pupeno 28.06.2009 15:12

Вы также можете использовать:

@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> 
}
Ответ принят как подходящий

HTML-файл загрузки ASP MVC 3.

Модель: (Обратите внимание, что атрибут FileExtensionsAttribute доступен в MvcFutures. Он будет проверять расширения файлов на стороне клиента и на стороне сервера.)

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

HTML-просмотр:

@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)
}

Действие контроллера:

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

Это не отображает ввод файла <input type = "file" />, только текстовое поле

Ben 06.08.2012 14:45

@PauliusZaliaduonis со строкой Microsoft.Web.Mvc.FileExtensions, MVC подчеркнут красным. Как мне это исправить?

Pomster 04.09.2012 12:05

@pommy Обратите внимание, что атрибут FileExtensionsAttribute доступен в MvcFutures (начиная с MVC3). Вы можете использовать источники отсюда: Источники или он доступен в .NET Framework 4.5, см. Документация MSDN

Paulius Zaliaduonis 05.09.2012 15:49

К сожалению, атрибут FileExtension, похоже, не работает с типом свойств HttpPostedFileBase, а скорее кажется строковым. По крайней мере, он никогда не принимал pdf как допустимое расширение.

Serj Sagan 13.02.2013 08:38

Это добавит атрибут значения (value = ""), который не будет подтвержден как действительный HTML5. значение недопустимо для файлов и изображений входных типов. Я не вижу способа удалить атрибут value. Кажется, это жестко запрограммировано.

Dan Friedman 06.11.2013 00:33

К вашему сведению, использование HttpPostedFile, а не HttpPostedFileBase в качестве типа параметра в методе действия, приводит к тому, что система привязки игнорирует файл.

Samih A 08.08.2014 13:42

@SerjSagan Вы можете создать собственный атрибут для обработки расширений файлов для HttpPostedFileBase. См. Этот ответ stackoverflow.

skeletank 08.06.2015 16:10

Теперь у меня появляются 3 текстовых поля, и в каждом есть кнопка просмотра. они помечены как FileName, contenttype и contentlength ???

Rudy Hinojosa 01.12.2016 00:09

@RudyHinojosa, мне жаль слышать, если не сработало. Убедитесь, что у вас правильный синтаксис C# и Razor. В качестве альтернативы используйте простую HTML-форму и ввод.

Paulius Zaliaduonis 04.12.2016 21:35

Улучшенная версия ответа Паулюса Залиадуониса:

Чтобы проверка работала должным образом, мне пришлось изменить модель на:

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;
            }
        }
}

и вид на:

@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 писал об атрибуте FileExtension, работающем только со строками.

Разве вы не можете объединить этот ответ с ответом Паулиуса?

Graviton 18.12.2014 05:14

Я думаю, это немного взломано, но в результате применяются правильные атрибуты проверки и т. д.

@Html.Raw(Html.TextBoxFor(m => m.File).ToHtmlString().Replace("type=\"text\"", "type=\"file\""))

Это тоже работает:

Модель:

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

Вид:

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

Действие контроллера:

[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;
            }

Список типов содержимого

Или вы могли бы сделать это правильно:

В вашем классе расширения HtmlHelper:

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));
    }

Эта строка:

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

Создает идентификатор, уникальный для модели, который вы знаете в списках и т. д. модель [0]. Имя и т. д.

Создайте правильное свойство в модели:

public HttpPostedFileBase NewFile { get; set; }

Затем вам нужно убедиться, что ваша форма будет отправлять файлы:

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

Тогда вот вам помощник:

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

Это решение больше радует глаз и поддерживает меня в соответствии с вспомогательными методами @Html.

Yahfoufi 30.01.2019 16:37

Другие вопросы по теме