Событие on click не работает при попытке обновить изображение, щелкнув существующее изображение

Question

У меня есть страница профиля, где пользователь может обновить свою фотографию профиля. Я добавил jQuery при нажатии на изображение. Однако при нажатии на изображение не отображается окно загрузки файла для выбора изображения.

Это мое свойство профиля клиента CustomerDetailsViewModel:

public IFormFile ProfilePicture { get; set; }

Вот мои элементы в просмотр бритвы:

@model CustomerDetailsViewModel

@{
    var imagePath = "~/Images/" + (Model.ProfilePicture?.FileName ?? "noimage.png");
}

<form asp-action="UpdateDetails">
    <input type="hidden" asp-for="ProfilePicture" class="profile-picture-upload" />
    <img src="@imagePath" asp-append-version="true" class="profile-picture" style="height:50px; width:50px"/>
    <input type="submit" value="Update" class="btn btn-primary" />
</form>

@section Scripts {
<script src="~/js/fileUpload.js"></script>
}

Вот мое jQuery событие щелчка:

$(document).ready(function () {
    $('body').on('click', '.profile-picture', function () {
        $('.profile-picture-upload').click();
    });
})

Это asp. net основная проблема или jquery проблема? Я не понимаю, почему это не сработает, у меня в свойстве модели установлено свойство IFormFile.