Лучшая практика: как мне реализовать список, похожий на список пользователей Stackoverflow?

Question

Используемые технологии :

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

Case

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

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

Nice. Это решило у нас еще одну проблему:

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

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

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

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

Answer 1

Я бы сделал пользовательский элемент управления «AuthorList.ascx», который выводит список авторов в правильном формате (то есть с HTML) в виде фрагмента.(Нет тегов HEAD / HTML / BODY, просто обычные фрагментированные объекты, как обычно, с элементом управления 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, чтобы вы могли копировать из одного в другое без особых изменений.