Best pratice: Как реализовать список, похожий на список пользователей Stackoverflow?

Question

Technologies участвует:

1. ASP.NET Web-формы
2. Javascript (JQuery, например)

Case

Для наглядности давайте дать Stackoverflow Users list В качестве примера. Этот список можно манипулировать на стороне клиента. Я могу искать, страницы и так далее. Поэтому, очевидно, нам нужно будет вызвать jQuery.ajax для извлечения HTML каждой страницы при поиске. Хорошо. Теперь это оставляет мне первый вопрос:

Что такое лучший способ визуализации ответа для jQuery.ajax на стороне сервера? Я не могу использовать шаблоны, я полагаю, поэтому наиболее очевидным решением является создание тегов HTML в качестве серверных элементов управления и их рендеринг в результате запроса ASHX? Это лучший подход?

Ницца. Это решено, что у нас есть еще одна проблема:

Когда пользователь впервые входит в Authors List, первая страница списка должна быть уже с сервера полностью отлажена? Конечно, мы могли бы отобразить первую страницу, а также вызов ajax, но я не думаю, что это лучше. На этот раз я МОГУ использовать шаблоны для отображения списка, но этот шаблон нельзя использовать повторно в случае 1. Что мне делать?

Теперь последний вопрос:

Теперь у нас есть 2 стратегии рендеринга: 1) клиент и 2) сервера. Как повторно использовать код для 2-х рендерингов?

Каковы наилучшие оценки для решения этих проблем?

Answer 1

Я бы сделал пользовательский контроль под названием «AuthorList.ascx», который выводит список авторов в правильном формате (то есть с HTML) в качестве фрагмента. (Нет тегов HEAD/HTML/BODY, просто прямое вещество типа fragmet, как обычно, с помощью элемента управления ASCX.

Тогда я бы сделал страницу «Список авторов» как обычно, отбросив этот новый элемент управления, который я только что сделал внутри div:

<div id="author-list"><uc1:authorList runat="server" id="userList1" /></div> 

Этого достаточно для случая 2.

Чтобы добавить к нему обновление Ajax, я хотел бы сделать новую страницу, которая не имеет ничего, кроме контроля AuthorList.ascx в нем:

<%@ Page ... %> 
<%@ Register ... %> 
<uc1:authorList runat="server" id="userList1" /> 

Использование JQuery Я хотел бы сделать:

$('#author-list').load('path-to-the-second-aspx-page-containing-user-contor.aspx', { 
    // args here 
}); 

Позволяет обновлять содержимое списка авторов через AJAX для последующих запросов, таких как поиск, фильтр, пейджинг и т. Д.

Answer 2

Если вы создаете теги html на сервере, повторное использование достаточно просто. В любом случае вы добавляете элементы управления html в родительский элемент управления, поэтому вы просто создаете метод, доступный с обеих страниц, который принимает родительский элемент управления в качестве параметра и вызывает его из CreateChildControls.

Если вы отправляете json-данные клиенту, используйте рендеринг на стороне клиента только во время разработки (используя вызов ajax в onload). Затем вы можете добавить версию на стороне сервера, если это не изменится слишком сильно. В большинстве случаев должно быть возможно написать код в стиле, который будет работать как в jquery, так и в .net, чтобы вы могли копировать один из них без лишних изменений.