0

подскажите, пожалуйста, как правильно отображать частичные представления

в Index.cshtml есть 2 частичных представления :

<div class="row">
    <div class="col-lg-2 col-md-3 col-sm-4 col-12 project-sidebar">
        @Html.Partial("ProjectList", Model.Projects)
    </div>
    <br />
    <div class="col-lg-10 col-md-9 col-sm-8 col-12 project-space">
        @Html.Partial("ProjectFiles", Model.Projects.FirstOrDefault(p => p.Id == int.Parse(ViewData["SelectedProjectId"].ToString())))
    </div>
</div>

в ProjectList.cshtml есть следующий фрагмент:

<li class="list-group-item" onclick="location.href='@Url.Action("SelectProject", "Home", new { projectId = project.Id })'">@project.Name</li>

его обработчик я хочу написать как-то так:

    [HttpGet]
    public async Task<IActionResult> SelectProject(int projectId)
    {
        var project = await _dataService.GetAllQuery<Project>()
            .Include(p => p.HashValues)
            .FirstOrDefaultAsync(p => p.Id == projectId);

        return PartialView("ProjectFiles", project); // ?
    }

т.е. изменить второе частичное представление

Проблема в том, что я просто перехожу на данное представление, а мне надо просто обновить его. Сейчас у меня все работает через ViewData[..], я просто постоянно обновляю index, вытаскивая ВСЕ данные для частичных представлений...

2 ответа 2

1

В общем, разобрался, сделал так

index.cshtml:

 <div class="row">
    <div class="col-lg-2 col-md-3 col-sm-4 col-12 project-sidebar">
        @Html.Partial("ProjectList", Model.Projects)
    </div>
    <br />
    <div class="col-lg-10 col-md-9 col-sm-8 col-12 project-space" id="projectFilesPart">
        @Html.Partial("ProjectFiles", new ProjectGuard.Ef.Entities.Project())
    </div>
</div>

в ProjectList.cshtml сохранил id в value:

<li class="list-group-item" value="@project.Id">@project.Name</li>

Обновляю второе частичное представление так:

$(document).ready(function () {
$('.list-group-item').click(function () {
    $.ajax(
        {
            url: 'Home/SelectProject',
            type: 'GET',
            data: { projectId: $(this).val() },

            success: function (partialView) {
                $('#projectFilesPart').html(partialView);
                $('#projectFilesPart').show();
            }
        });
})});
0

@Url.Action как раз и должен вызвать переход по action-у контроллера (если я не ошибаюсь). Если Вам нужно обновить только часть страницы, используйте AJAX.

3
  • Да, в вопросе я указал обработчик. В нем я получаю нужный мне объект, который является моделью для другого частичного представления. Вот не понимаю, как мне изменить второе частичное представление (да, изменить часть страницы). Получается, нельзя не прибегая к js это организовать?
    – Snaffu
    14 сен 2020 в 9:13
  • Классика жанра это AJAX. Можно конечно в GET action метода, который отдаёт основное представление добавить необязательный параметр в виде id проекта и по ссылке переходить по нему. Но, это приведёт к полной перезагрузке страницы для обновления данных и усложнению логики приложения.
    – Streletz
    14 сен 2020 в 9:42
  • 1
    Использовал AJAX, все получилось
    – Snaffu
    14 сен 2020 в 10:12

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.