Передача значения в <input type="file">

@VLADIMIRz01 · Регистрация: 12.11.2020

Студворк — интернет-сервис помощи студентам

Приветствую! Пишу первый проект на ASP.NET (C#). Это Movie List похожий на тот, что делают в гайдах от Майкрософт, но я его усложнил, добавив фильмам картинки.
Столкнулся с такой проблемой: при редактировании информации поле выбора файла всегда пустое (input type="file"). Получается, чтобы внести любые изменения нужно каждый раз выбирать картинку.
При создании фильма выбранная картинка сохраняется в wwwroot/image, а в БД записывается относительный путь к ней, который используется в src. (отображение работает).
Все остальные данные из БД отображаются в полях корректно.
Пытался явно передавать путь в value. Передаётся, в коде видно, но поле всё равно пустое.
Подскажите, пожалуйста, что с этим можно сделать. Хотябы в какую сторону гуглить)))
Метод Edit в контроллере

C#
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
public async Task<IActionResult> Edit(int? id)
{
    if (id == null || _context.Movie == null)
    {
        return NotFound();
    }
 
    var movie = await _context.Movie.FindAsync(id);
    if (movie == null)
    {
        return NotFound();
    }
    return View(movie);
}
 
[HttpPost]
[ValidateAntiForgeryToken]
public async Task<IActionResult> Edit(int id, IFormFile image, [Bind("Id,Title,ReleaseDate,Genre,Imdb,Rating,Image")] Movie movie)
{
    if (id != movie.Id)
    {
        return NotFound();
    }
 
    if (image != null)
    {
 
        string path = "image/" + movie.Title!.Replace(" ", "") + "Cover";
        string extension = Path.GetExtension(image.FileName);
 
        using (var fileStream = new FileStream(_webHostEnvironment.WebRootPath + "/" + path + extension, FileMode.Create))
        {
            await image.CopyToAsync(fileStream);
            movie.Image = (path + extension);
        }
    }
 
    if (ModelState.IsValid)
    {
        try
        {
            _context.Update(movie);
            await _context.SaveChangesAsync();
        }
        catch (DbUpdateConcurrencyException)
        {
            if (!MovieExists(movie.Id))
            {
                return NotFound();
            }
            else
            {
                throw;
            }
        }
        return RedirectToAction(nameof(Index));
    }
    return View(movie);
}

Представление Edit

C#
1
2
3
4
5
<div class="mb-3">
    <label asp-for="Image" class="control-label"></label>
    <input asp-for="Image" type="file" accept="image/jpeg" class="form-control" />
    <span asp-validation-for="Image" class="text-danger"></span>
</div>

@IamRain · 10.09.2023, 06:10

Непонятен вопрос, проблемы с отображением уже загруженной картинки?

Добавлено через 2 минуты
pass-image-from-controller-to-view

@VLADIMIRz01 · 10.09.2023, 06:39 **[ТС]**

IamRain, нет, проблема в том, что при пиреходе на Edit само поле пустое, хотя картинка загружена и отображается на главной корректно. И чтобы внести и сохранить любые изменения приходится выбирать картинку заново (чтоб поле заполнилось)

@IamRain · 10.09.2023, 07:25

Сообщение от VLADIMIRz01

что при пиреходе на Edit само поле пустое,

Так смысл этого поля - загрузка файла на сервер. Вы хотите, чтобы после однократной загрузки в этом поле снова появлялся выбранный файл? Таким образом, при изменении любого произвольного поля и последующей отправки формы эта же самая картинка будет загружена еще раз. Это неправильный UX. - Должна отображаться только загруженная однажды картинка. А input=file устанавливается только при участии пользователя, это поле нельзя менять на стороне js-а:
MDN - input=file

You cannot set the value of a file picker from a script — doing something like the following has no effect:

Добавлено через 3 минуты

Сообщение от IamRain

Так смысл этого поля - загрузка файла на сервер.

То есть по вашей задумке правильно должно быть так: при открытии по GET-у Edit формы, сервер говорит: "Я знаю, ты хочешь загрузить свой однажды загруженный файл СНОВА, и я уже установил значение input=file для тебя". Очевидно, это неправильно - должна отображаться просто ранее загруженная картинка с возможностью ее изменить.

Добавлено через 3 минуты
Отключите валидацию на это поле. И можно на бэке принимать просто единую RequestModel (c IFormFile внутри), а не кашу в параметрах, как у вас сейчас.

@VLADIMIRz01 · 10.09.2023, 09:36 **[ТС]**

IamRain, да, по идее файл должен был перезаписываться каждый раз. Понимаю, что это не эффективно. Буду искать, как сделать изменение. Спасибо

Добавлено через 34 минуты
IamRain, не могли бы подсказать, как сделать возможность изменения? Сейчас, если убрать поле выбора файла, то при сохранении изменений в БД пишется старый путь переписывается на null и картинка вообще перестаёт отбражаться

@IamRain · 10.09.2023, 09:57

Сообщение от VLADIMIRz01

й в БД пишется старый путь переписывается на null и картинка вообще перестаёт отбражаться

Попробуйте заменить

C#
25
if (image != null)

на такое:

C#
25
if (image != null && image.Length > 0)

@VLADIMIRz01 · 10.09.2023, 10:25 **[ТС]**

IamRain, В таком случае изменения не сохраняются. Возвращает на эту же страницу

Добавлено через 14 минут
IamRain,

Сообщение от VLADIMIRz01

Сейчас, если убрать поле выбора файла, то при сохранении изменений в БД пишется старый путь переписывается на null и картинка вообще перестаёт отбражаться

эту проблемы решил сделав в представлении по аналогии с id

C#
1
2
<div asp-validation-summary="ModelOnly" class="text-danger"></div>
<input type="hidden" asp-for="Image" />

@IamRain · 10.09.2023, 11:55

Сообщение от VLADIMIRz01

В таком случае изменения не сохраняются. Возвращает на эту же страницу

Смотреть где спотыкается; если это валидация по этому полю, то убрать ее.

@VLADIMIRz01 · 10.09.2023, 19:08 **[ТС]**

В итоге проблема решена так:

C#
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
[HttpPost]
[ValidateAntiForgeryToken]
// IFormFile сделал Nullabl
public async Task<IActionResult> Edit(int id, IFormFile image, [Bind("Id,Title,ReleaseDate,Genre,Imdb,Rating,Image")] Movie movie)
{
    if (id != movie.Id)
    {
        return NotFound();
    }
 
    if (image != null)
    {
 
        string path = "image/" + movie.Title!.Replace(" ", "") + "Cover";
        string extension = Path.GetExtension(image.FileName);
 
        using (var fileStream = new FileStream(_webHostEnvironment.WebRootPath + "/" + path + extension, FileMode.Create))
        {
            await image.CopyToAsync(fileStream);
            movie.Image = (path + extension);
        }
    }
 
    if (ModelState.IsValid)
    {
        try
        {
            _context.Update(movie);
            await _context.SaveChangesAsync();
        }
        catch (DbUpdateConcurrencyException)
        {
            if (!MovieExists(movie.Id))
            {
                return NotFound();
            }
            else
            {
                throw;
            }
        }
        return RedirectToAction(nameof(Index));
    }
    return View(movie);
}

А в представление добавил поле для выбора файла

C#
1
2
3
4
5
6
7
8
9
// Скрытое поле со значением Image (чтобы не пропадала картинка после сохранения, когда её не изменяют)
<div asp-validation-summary="ModelOnly" class="text-danger"></div>
<input type="hidden" asp-for="Image" />
//поле для выбора картинки (если хотим изменить)
<div class="mb-3">
    <label class="control-label">Change Image</label>
    <input type="file" accept=".jpeg,.jpg,.png" asp-for="Image" class="form-control" />
    @* <span asp-validation-for="Image" class="text-danger"></span> *@
</div>

Потом я вынес сохранение в отдельный метод и добавил проверку того, что выбрана именно картинка, но это уже другая история)))

Новые блоги и статьи Все статьи Все блоги /
Owen Logic: О недопустимости использования связки «аналоговый ПИД» + RegKZR ФедосеевПавел 06.01.2026 Owen Logic: О недопустимости использования связки «аналоговый ПИД» + RegKZR ВВЕДЕНИЕ Введу сокращения: аналоговый ПИД — ПИД регулятор с управляющим выходом в виде числа в диапазоне от 0% до. . .	Модель микоризы: классовый агентный подход 2 anaschu 06.01.2026 репозиторий https:/ / github. com/ shumilovas/ fungi ветка по-частям. коммит Create переделка под биомассу. txt вход sc, но sm считается внутри мицелия. кстати, обьем тоже должен там считаться. . . .	Расчёт токов в цепи постоянного тока igorrr37 05.01.2026 / * Дана цепь постоянного тока с сопротивлениями и напряжениями. Надо найти токи в ветвях. Программа составляет систему уравнений по 1 и 2 законам Кирхгофа и решает её. Последовательность действий:. . .	Новый CodeBlocs. Версия 25.03 palva 04.01.2026 Оказывается, недавно вышла новая версия CodeBlocks за номером 25. 03. Когда-то давно я возился с только что вышедшей тогда версией 20. 03. С тех пор я давно снёс всё с компьютера и забыл. Теперь. . .
Модель микоризы: классовый агентный подход anaschu 02.01.2026 Раньше это было два гриба и бактерия. Теперь три гриба, растение. И на уровне агентов добавится между грибами или бактериями взаимодействий. До того я пробовал подход через многомерные массивы,. . .	Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Programma_Boinc 28.12.2025 Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Налог на собак: https:/ / ********/ gallery/ V06K53e Финансовый отчет в Excel: https:/ / ********/ gallery/ bKBkQFf Пост отсюда. . .	Кто-нибудь знает, где можно бесплатно получить настольный компьютер или ноутбук? США. Programma_Boinc 26.12.2025 Нашел на реддите интересную статью под названием Anyone know where to get a free Desktop or Laptop? Ниже её машинный перевод. После долгих разбирательств я наконец-то вернула себе. . .	Thinkpad X220 Tablet — это лучший бюджетный ноутбук для учёбы, точка. Programma_Boinc 23.12.2025 Рецензия / Мнение/ Перевод Нашел на реддите интересную статью под названием The Thinkpad X220 Tablet is the best budget school laptop period . Ниже её машинный перевод. Thinkpad X220 Tablet —. . .

@IamRain 4694 / 2702 / 734 Регистрация: 02.08.2011 Сообщений: 7,228
	10.09.2023, 06:10
	Непонятен вопрос, проблемы с отображением уже загруженной картинки? Добавлено через 2 минуты pass-image-from-controller-to-view 0

@VLADIMIRz01 1 / 1 / 0 Регистрация: 12.11.2020 Сообщений: 99
	10.09.2023, 06:39 [ТС]
	IamRain, нет, проблема в том, что при пиреходе на Edit само поле пустое, хотя картинка загружена и отображается на главной корректно. И чтобы внести и сохранить любые изменения приходится выбирать картинку заново (чтоб поле заполнилось) Миниатюры 0

@VLADIMIRz01 1 / 1 / 0 Регистрация: 12.11.2020 Сообщений: 99
	10.09.2023, 09:36 [ТС]
	IamRain, да, по идее файл должен был перезаписываться каждый раз. Понимаю, что это не эффективно. Буду искать, как сделать изменение. Спасибо Добавлено через 34 минуты IamRain, не могли бы подсказать, как сделать возможность изменения? Сейчас, если убрать поле выбора файла, то при сохранении изменений в БД пишется старый путь переписывается на null и картинка вообще перестаёт отбражаться 0