Net Core Razor Pages как вернуть частичное представление?

@ViterAlex · Регистрация: 11.02.2013

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

Пытаюсь тут разобраться. Есть Net Core Web Application, не MVC. Как на страницу вернуть частичное представление в ответ на ajax?

HTML5

@page
@model IndexModel
@{
    ViewData["Title"] = "Home page";
}
 
<hr />
<form asp-action="Search" data-ajax-method="POST" data-ajax-mode="Replace" data-ajax-success="onSuccess" data-ajax="true" data-ajax-update="foundTracks">
    <div class="form-group">
        <div class="col-sm-10">
            <input type="text" name="url" class="form-control" id="url">
        </div>
        <button type="submit" id="searchBtn" class="btn btn-primary"><span class="glyphicon glyphicon-search"></span>&nbsp;Найти</button>
    </div>
</form>
@section Scripts    {
    <script>
        function onSuccess() {
            $('#foundTracks').val();
            alert('Success!');
        }
        $(document).ready(function () {
            $('#searchBtn').prop('disabled', true)
            $('#url').on('keyup', function () {
                if ($(this).val() === '')
                    $('#searchBtn').prop('disabled', true);
                else
                    $('#searchBtn').prop('disabled', false)
            })
        })
    </script>
}
<div id="foundTracks">
    @Html.Partial("Programs", Model.ProgramInfo)
</div>

Вот если прямо его рендерить на странице, то это получается (строка 34), а вот обновить по запросу из формы не могу. Хотя запрос отрабатывает. Что нужно вернуть из метода OnPostSearch, чтобы обновить содержание div?

Добавлено через 5 часов 14 минут
Пока решил передачей $.ajax→json, но очень неудобно, если нужна более-менее сложная разметка, получается борода на js

@Woldemar89 · 09.01.2018, 11:24

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

на настоящий момент нельзя серверными средствами вернуть частичное представление в ответ на запрос.

Вернуть-то можно, скорее
"сервер, отвечая PartialView, не может менять структуру html на клиенте" - а это какбэ очевидно.

@Usaga · 09.01.2018, 13:01

Woldemar89, речь о том, что в Razor Pages неможно ответить частичным прtдставлением, как это работает в ASP.NET (Core) MVC. Выше даже ссылка приводилась на issue на github, где один из разрабов asp.net это прямо сказал.

@sau · 19.03.2018, 23:58

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

что в Razor Pages неможно ответить частичным прtдставлением

Хреново , мне Razor Pages понравился , во-первых таг.хелперы более читабельны чем хтмл.хелперы - считай привычные html атрибуты , и избавляемся от чужеродного синтаксиса (хотя таг.хелперы и в mvc можно внедрить вроде как).
Во-вторых , организация структуры кода pages гораздо ближе к модели компонентов (так мною любимой) , когда логически связанные элементы рядышком.

Что касается ajax рендеринга , то тут действительно есть зоопарк технологий , если нет встроенной возможности вернуть частичное представление в razor pages , приходится заниматься рендерингом на стороне клиента , и естественно в сложных представлениях рендеринг совсем не хочется делать нативным js , но если взять тот же angular 2 - то он хочет подмять под себя рендеринг всей страницы от корня - что не всегда удобно. (а точнее совсем не удобно , если в основном страница строится серверным рендерингом , и нужно обновлять только кусочек - например компоненту таблицы)

В общем , все время вспоминаю про старые добрые веб.формы ) - в которых как то удачно все эти вопросы решены.

@Usaga · 20.03.2018, 04:22

sau, таг-хелперы - фишка самого шаблонизатора (разора), так что в MVC оно доступно на полную катушку.

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

но если взять тот же angular 2 - то он хочет подмять под себя рендеринг всей страницы от корня - что не всегда удобно. (а точнее совсем не удобно , если в основном страница строится серверным рендерингом , и нужно обновлять только кусочек - например компоненту таблицы)

Ангуляр не запрещает получать шаблоны компонентов по URL-у от сервера, который шаблон этот может нарисовать тем же разором (мы на работе так и поступили со своим старым приложением, когда начали внедрять ангуляр).

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

В общем , все время вспоминаю про старые добрые веб.формы ) - в которых как то удачно все эти вопросы решены.

Вебформс - технология сильно оторванная от реалий веба (как и задумывалось), что сейчас уже сильно неудобно. Это в начале 2000-х оно канало, когда веб был деревянно-табличным. А сейчас...

@sau · 20.03.2018, 12:43

Ангуляр не запрещает получать шаблоны компонентов по URL-у от сервера, который шаблон этот может нарисовать тем же разором (мы на работе так и поступили со своим старым приложением, когда начали внедрять ангуляр).

в первой версии да , во второй перемудрили - шаблон там html-лный и упаковывается на этапе сборки в js. веб.паком. , или нет ?

@Usaga · 20.03.2018, 12:46

sau, ничего там не перемудрили. Вы или template: require делаете с упаковкой шаблона в бандл, или templateUrl: 'url' для запроса в рантайме. А откуда запрашиваете - уже не важно (что удобно).

@sau · 20.03.2018, 12:51

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

sau, ничего там не перемудрили. Вы или template: require делаете с упаковкой шаблона в бандл, или templateUrl: 'url' для запроса в рантайме

окей . попробую. , с 2-м только начал знакомиться.

А что касательно root элемента (bootstrapModule регистрация) , есть элегантные способы создать множество root элементов на странице (где root по сути отдельный компонент решающий маленькую задачу) и обеспечить их взаимодействие ?
- в первом можно было навесить атрибут app на существующий элемент , который обеспечивал связь между всеми дочерними контролами , но при этом не подчищал верстку страницы.

@Usaga · 20.03.2018, 12:53

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

попробую. , с 2-м только начал знакомиться.

Уже пятая версия в ходу)

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

А что касательно root элемента , есть элегантные способы создать множество root элементов на странице (где root по сути отдельный компонент решающий маленькую задачу) и обеспечить их взаимодействие ?
- в первом можно было навесить атрибут app на существующий элемент , который обеспечивал связь между всеми дочерними контролами , но при этом не подчищал верстку страницы.

Не уверен, что такое стоит делать с ангуляром. Лучше что-то маленькое для этого испльзовать, типа KnockoutJS или VueJS.

@sau · 20.03.2018, 13:19

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

Не уверен, что такое стоит делать с ангуляром. Лучше что-то маленькое для этого испльзовать, типа KnockoutJS или VueJS.

Да я смотрел их , не нравится реализованная модель , мне нужен MVVM в компонентах , под компонентом понимается кусочек html и закрепленный за ним класс обработчик , плюс платформа должна обеспечивать взаимодействие компонентов - двухсторонние привязки , событийная модель и всякие инжектабл сервисы (аля http client) - дабы не прикручивать всякие jquery. У ангуляра с этим все в порядке , но есть некоторые архитектурные требования - которые меня не радуют. Нарпмер , даже если извернуться и зарегестрировать несколько root элементов , они не умеют считывать атрибуты инициализации т.к для корневых элементов ангуляром такой механизм не предусмотрен ((( , не говоря уже о механизме их взаимодействия.
- по сути навязывают рендеринг всей страницы через движок ангуляра , чего не было в первой версии. , а в первой версии с архитектурой компонентов не все гладко. В общем , как дальше жить не знаю ).

П.С 5-я там по сути это 2.5 , 2-м я называю сборку основанную на компонентах. , там они уже в мелочах ее допиливают под разными версиями.

Добавлено через 10 минут
П.С Может еще раз к Vue присмотрюсь , если с ангуляром подружиться не выйдет , но уже начальное определение вида new Vue({ Data:.... Methods:... }) настораживает процедурным подходом , а если у меня ряд классов где и методы и свойства , я их должен магическим образом упаковать в этот сетап , вычленить методы отдельно , нужно курить в общем.

@Usaga · 20.03.2018, 13:39

KnockoutJS вполне себе умеет в компоненты и взаимодействие между ними, разве что сервисов и DI впониме нету. Тут уж вам решать, маленькие и простые нокауты\вуи или комбайн ангулярный со своими требованиями и хотелками.

@sau · 20.03.2018, 14:06

А все почему , потому что мелкософт в какой то момент сказала - пользуйтесь разработками сообщества . а у сообщества нет единого мнения на счет того как нужно разрабатывать веб.пирложения - половина решений понятия не имеет про ООП и прочих продвинутых принципах в серверной разработке , отсюда весь геморрой в попытках скрестить бульдога с носорогом , а вот в веб.формах есть полный продуманный пакет от клиента до сервера в одном фреймворке. То что там устарело можно не использовать (хотя я не вижу где и чего там устарело) , удручает лишь то - что хайп вокруг новшеств мешает использовать. , заказчики хотят все новое и "продвинутое"/

П.С Присмотрелся к компонентам в Vue , похоже то что нужно , ангуляр идет лесом.

@Woldemar89 TheGreatCornholio 1254 / 732 / 285 Регистрация: 30.07.2015 Сообщений: 2,408
	09.01.2018, 11:24	21
	Сообщение от ViterAlex на настоящий момент нельзя серверными средствами вернуть частичное представление в ответ на запрос. Вернуть-то можно, скорее "сервер, отвечая PartialView, не может менять структуру html на клиенте" - а это какбэ очевидно. 0

@sau 2735 / 2041 / 380 Регистрация: 22.07.2011 Сообщений: 7,731
	20.03.2018, 12:43	25
	Ангуляр не запрещает получать шаблоны компонентов по URL-у от сервера, который шаблон этот может нарисовать тем же разором (мы на работе так и поступили со своим старым приложением, когда начали внедрять ангуляр). в первой версии да , во второй перемудрили - шаблон там html-лный и упаковывается на этапе сборки в js. веб.паком. , или нет ? 0

@Usaga 12079 / 8388 / 1281 Регистрация: 21.01.2016 Сообщений: 31,601
	20.03.2018, 12:46	26
	sau, ничего там не перемудрили. Вы или `template: require` делаете с упаковкой шаблона в бандл, или `templateUrl: 'url'` для запроса в рантайме. А откуда запрашиваете - уже не важно (что удобно). 0

@sau 2735 / 2041 / 380 Регистрация: 22.07.2011 Сообщений: 7,731
	20.03.2018, 12:51	27
	Сообщение от Usaga sau, ничего там не перемудрили. Вы или template: require делаете с упаковкой шаблона в бандл, или templateUrl: 'url' для запроса в рантайме окей . попробую. , с 2-м только начал знакомиться. А что касательно root элемента (bootstrapModule регистрация) , есть элегантные способы создать множество root элементов на странице (где root по сути отдельный компонент решающий маленькую задачу) и обеспечить их взаимодействие ? - в первом можно было навесить атрибут app на существующий элемент , который обеспечивал связь между всеми дочерними контролами , но при этом не подчищал верстку страницы. 0

@Usaga 12079 / 8388 / 1281 Регистрация: 21.01.2016 Сообщений: 31,601
	20.03.2018, 12:53	28
	Сообщение от sau попробую. , с 2-м только начал знакомиться. Уже пятая версия в ходу) Сообщение от sau А что касательно root элемента , есть элегантные способы создать множество root элементов на странице (где root по сути отдельный компонент решающий маленькую задачу) и обеспечить их взаимодействие ? - в первом можно было навесить атрибут app на существующий элемент , который обеспечивал связь между всеми дочерними контролами , но при этом не подчищал верстку страницы. Не уверен, что такое стоит делать с ангуляром. Лучше что-то маленькое для этого испльзовать, типа KnockoutJS или VueJS. 0

@Usaga 12079 / 8388 / 1281 Регистрация: 21.01.2016 Сообщений: 31,601
	09.01.2018, 13:01	22
	Woldemar89, речь о том, что в Razor Pages неможно ответить частичным прtдставлением, как это работает в ASP.NET (Core) MVC. Выше даже ссылка приводилась на issue на github, где один из разрабов asp.net это прямо сказал. 1

@sau 2735 / 2041 / 380 Регистрация: 22.07.2011 Сообщений: 7,731
	19.03.2018, 23:58	23
	Сообщение от Usaga что в Razor Pages неможно ответить частичным прtдставлением Хреново , мне Razor Pages понравился , во-первых таг.хелперы более читабельны чем хтмл.хелперы - считай привычные html атрибуты , и избавляемся от чужеродного синтаксиса (хотя таг.хелперы и в mvc можно внедрить вроде как). Во-вторых , организация структуры кода pages гораздо ближе к модели компонентов (так мною любимой) , когда логически связанные элементы рядышком. Что касается ajax рендеринга , то тут действительно есть зоопарк технологий , если нет встроенной возможности вернуть частичное представление в razor pages , приходится заниматься рендерингом на стороне клиента , и естественно в сложных представлениях рендеринг совсем не хочется делать нативным js , но если взять тот же angular 2 - то он хочет подмять под себя рендеринг всей страницы от корня - что не всегда удобно. (а точнее совсем не удобно , если в основном страница строится серверным рендерингом , и нужно обновлять только кусочек - например компоненту таблицы) В общем , все время вспоминаю про старые добрые веб.формы ) - в которых как то удачно все эти вопросы решены. 0

@Usaga 12079 / 8388 / 1281 Регистрация: 21.01.2016 Сообщений: 31,601
	20.03.2018, 04:22	24
	sau, таг-хелперы - фишка самого шаблонизатора (разора), так что в MVC оно доступно на полную катушку. Сообщение от sau но если взять тот же angular 2 - то он хочет подмять под себя рендеринг всей страницы от корня - что не всегда удобно. (а точнее совсем не удобно , если в основном страница строится серверным рендерингом , и нужно обновлять только кусочек - например компоненту таблицы) Ангуляр не запрещает получать шаблоны компонентов по URL-у от сервера, который шаблон этот может нарисовать тем же разором (мы на работе так и поступили со своим старым приложением, когда начали внедрять ангуляр). Сообщение от sau В общем , все время вспоминаю про старые добрые веб.формы ) - в которых как то удачно все эти вопросы решены. Вебформс - технология сильно оторванная от реалий веба (как и задумывалось), что сейчас уже сильно неудобно. Это в начале 2000-х оно канало, когда веб был деревянно-табличным. А сейчас... 1

@sau 2735 / 2041 / 380 Регистрация: 22.07.2011 Сообщений: 7,731
	20.03.2018, 13:19	29
	Сообщение от Usaga Не уверен, что такое стоит делать с ангуляром. Лучше что-то маленькое для этого испльзовать, типа KnockoutJS или VueJS. Да я смотрел их , не нравится реализованная модель , мне нужен MVVM в компонентах , под компонентом понимается кусочек html и закрепленный за ним класс обработчик , плюс платформа должна обеспечивать взаимодействие компонентов - двухсторонние привязки , событийная модель и всякие инжектабл сервисы (аля http client) - дабы не прикручивать всякие jquery. У ангуляра с этим все в порядке , но есть некоторые архитектурные требования - которые меня не радуют. Нарпмер , даже если извернуться и зарегестрировать несколько root элементов , они не умеют считывать атрибуты инициализации т.к для корневых элементов ангуляром такой механизм не предусмотрен ((( , не говоря уже о механизме их взаимодействия. - по сути навязывают рендеринг всей страницы через движок ангуляра , чего не было в первой версии. , а в первой версии с архитектурой компонентов не все гладко. В общем , как дальше жить не знаю ). П.С 5-я там по сути это 2.5 , 2-м я называю сборку основанную на компонентах. , там они уже в мелочах ее допиливают под разными версиями. Добавлено через 10 минут П.С Может еще раз к Vue присмотрюсь , если с ангуляром подружиться не выйдет , но уже начальное определение вида new Vue({ Data:.... Methods:... }) настораживает процедурным подходом , а если у меня ряд классов где и методы и свойства , я их должен магическим образом упаковать в этот сетап , вычленить методы отдельно , нужно курить в общем. 0

@Usaga 12079 / 8388 / 1281 Регистрация: 21.01.2016 Сообщений: 31,601
	20.03.2018, 13:39	30
	KnockoutJS вполне себе умеет в компоненты и взаимодействие между ними, разве что сервисов и DI впониме нету. Тут уж вам решать, маленькие и простые нокауты\вуи или комбайн ангулярный со своими требованиями и хотелками. 0

@sau 2735 / 2041 / 380 Регистрация: 22.07.2011 Сообщений: 7,731
	20.03.2018, 14:06	31
	А все почему , потому что мелкософт в какой то момент сказала - пользуйтесь разработками сообщества . а у сообщества нет единого мнения на счет того как нужно разрабатывать веб.пирложения - половина решений понятия не имеет про ООП и прочих продвинутых принципах в серверной разработке , отсюда весь геморрой в попытках скрестить бульдога с носорогом , а вот в веб.формах есть полный продуманный пакет от клиента до сервера в одном фреймворке. То что там устарело можно не использовать (хотя я не вижу где и чего там устарело) , удручает лишь то - что хайп вокруг новшеств мешает использовать. , заказчики хотят все новое и "продвинутое"/ П.С Присмотрелся к компонентам в Vue , похоже то что нужно , ангуляр идет лесом. 1