Meilleure pratique: Comment implémenter une liste similaire à la liste d'utilisateurs de Stackoverflow?

Question

Technologies impliquées:

1. formulaires Web-ASP.NET
2. Javascript (jQuery par exemple)

cas

Pour le rendre plus clair donnons de la Stackoverflow Users list par exemple. Cette liste peut être manipulée du côté client. Je peux chercher, page et ainsi de suite. Donc, évidemment, nous aurions besoin d'appeler jQuery.ajax pour récupérer le code HTML de chaque page après une recherche. Bien. Maintenant, cela me laisse avec la première question:

Quelle est la meilleure façon de rendre la réponse pour le jQuery.ajax côté serveur? Je ne peux pas utiliser de modèles, je suppose que la solution la plus évidente consiste à créer les balises HTML en tant que contrôles du serveur et à les restituer à la suite d'une requête ASHX. Est-ce la meilleure approche?

Nice. Ce que nous avons résolu un autre problème:

Lorsque l'utilisateur entre la première Authors List la première page de la liste devrait déjà venir du serveur complètement rendu bien? Bien sûr, nous pourrions rendre la première page ainsi qu'un appel ajax mais je ne pense pas que ce soit mieux. Cette fois, je peux utiliser des modèles pour rendre la liste mais ce modèle ne peut pas être réutilisé dans le cas 1. Que dois-je faire?

Maintenant, la dernière question:

Maintenant, nous avons 2 stratégies de rendu: 1) Client et 2) Server. Comment est-ce que je réutilise le code pour les 2 rendus?

Quels sont les meilleurs procédés pour résoudre ces problèmes?

Answer 1

Je créerais un contrôle utilisateur appelé "AuthorList.ascx" qui produirait la liste des auteurs dans le bon format (ie avec HTML), en tant que fragment. (Pas de balises HEAD/HTML/BODY, juste des trucs de type fractionné comme d'habitude avec un contrôle ASCX

Ensuite, je ferais ma page Author List comme d'habitude, en laissant tomber ce nouveau contrôle que je viens de faire dans un div:

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

Ceci est suffisant pour le cas 2.

Pour ajouter la mise à jour ajax, je voudrais faire une nouvelle page, qui n'a rien mais le contrôle AuthorList.ascx en elle:

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

En utilisant jQuery je ferais:

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

Ce qui vous permet de mettre à jour le contenu de la liste des auteurs via AJAX pour les demandes suivantes, telles que la recherche, le filtrage, la pagination, etc.

Answer 2

Si vous créez les balises html sur le serveur, la réutilisation est assez facile. Dans les deux cas, vous ajoutez des contrôles html à un contrôle parent, donc vous créez simplement une méthode disponible à partir des deux pages qui prend le contrôle parent en tant que paramètre et l'appelle à partir de CreateChildControls.

Si vous envoyez des données json au client, utilisez le rendu côté client uniquement pendant le développement (en utilisant un appel ajax dans onload). Vous pouvez ensuite ajouter une version côté serveur si nécessaire, une fois que la vue ne changera pas trop. Dans la plupart des cas, il devrait être possible d'écrire du code dans un style qui fonctionnera à la fois dans jquery et .net afin que vous puissiez copier de l'un à l'autre sans trop de changements.