Onglet Navigation - Cadres ou AJAX?

Question

J'ai ce que j'imagine être une interface Web assez standard.

Il existe 4 ListViews différents (contrôles de grille) auxquels on accède par une série d'onglets situés en haut.

J'ai implémenté ceci comme suit:

texte de remplacement http://img402.imageshack.us/img402/1530/pagedu8 .jpg

L’onglet 1 charge la page 1 contenant la grille 1 dans l’image 2, l’onglet 2 charge la page 2 contenant la grille 2 dans l’image 2, etc.

Cependant, cela signifie donc que si vous cliquez sur un élément de la grille et que je charge DetailsPage1.aspx dans l'image 2, l'image 1 et les onglets sont toujours visibles et actifs.

On m'a informé que je devrais avoir un seul cadre et charger les pages de manière dynamique en fonction du clic sur l'onglet, en utilisant HttpRequest (ou WebRequest dans asp.net).

Est-ce la bonne approche à adopter? Si vous avez des ressources ou des conseils à portée de main, nous vous en serions reconnaissants!

Merci

Answer 1

Les cadres sont un non absolu. Les cadres ne présentent aucun avantage qui ne peut être obtenu à l'aide d'autres techniques.

Cela signifie-t-il que vous devez utiliser AJAX? Pas nécessairement. AJAX est une solution parfaite si vous sentez le besoin de fournir une interface riche et transparente, mais ce n'est pas strictement nécessaire.

Vous pouvez utiliser des inclusions côté serveur pour séparer vos onglets en une autre sous-page (commune), mais puisque vous mentionnez ASP.NET (si vous utilisez une infrastructure v2 ou supérieure), vous pouvez utiliser des pages maîtres. , où vos onglets sont dans une section de contenu ou dans le maître lui-même, et vos grilles / détails dans une autre section de contenu.

La principale différence entre les deux techniques réside dans le fait qu’en utilisant AJAX, la transition d’un onglet à l’autre sera fluide et transparente, mais a) cela demande un peu plus de travail (en particulier si vous n’êtes pas familiarisé avec un framework AJAX donné) et b ) puisque vous avez essentiellement 4 pages en une, les pages sont plus "lourdes" et plus complexes à gérer. Si vous optez pour la route non-AJAX, la principale différence est qu’il y aura un petit effet de rafraîchissement lorsque vous cliquerez sur chaque onglet (étant donné qu’il charge une nouvelle page à chaque fois).

Bien entendu, les pages maîtres sont utiles pour conserver un style et une structure de site cohérents. Il n'y a donc aucune raison pour que vous ne puissiez pas utiliser AJAX avec un système de pages maîtres.

Answer 2

Les cadres sont boiteux: vous aurez des problèmes si les utilisateurs veulent définir un signet et s'ils visitent votre site via Google: votre cadre de navigation n'est alors pas visible. Donc, vous avez besoin de beaucoup de javascript sale. pour vérifier cela. Si vous avez besoin de javascript, faites-le dès le début et utilisez AJAX

Answer 3

Ajax est le meilleur choix. Mais gardez à l’esprit que vous pouvez naviguer entre les versions précédente et suivante. Le meilleur choix est de changer le hachage de la page. J'ai utilisé quelque chose comme ça:

domain.com/#tab1 pour le premier onglet domain.com/#tab2 pour le deuxième onglet

et ainsi de suite.

Si vous utilisez jQuery, cela peut être un bon début (je l'utilise et j'avais Aucun problème avec). Je suis sûr qu'il existe une solution pour tous les frameworks populaires:)

Answer 4

Au lieu d'utiliser des cadres, vous devez simplement inclure votre page de navigation dans toutes vos autres pages. Le navigateur verra que vous incluez le même document dans toutes vos pages et le mettra en cache.

Answer 5

Avez-vous essayé la TabContainer ou le chargement de tous les 4 détailler les volets et simplement afficher / masquer les panneaux lors du changement de sélection d’onglet?

En fonction des écrans que vos utilisateurs verront, si vous chargez les vues de détail de manière dynamique (Ajax ou Postback), vous aurez peut-être du mal à conserver les informations saisies par l'utilisateur et vous devrez attendre (les utilisateurs n'aiment pas attendre)

Answer 6

Je recommanderais d'utiliser jQuery et le plug-in jQuery UI. Aucun cadre ne sera nécessaire, il suffit de div des conteneurs.

Answer 7

Comme StingyJack, je vous suggère de consulter le TabContainer , mais vous voudrez peut-être faire attention à ce que votre ViewState ne devienne pas trop volumineux.

Ainsi, par exemple, ne chargez rien dans un GridView tant que cet onglet n'est pas affiché et supprimez-en le contenu (enregistrement dans la base de données bien sûr, si nécessaire. Utiliser l'événement ActiveTabChanged de TabContainer serait la clé de cette opération. Vous pouvez afficher ViewState pour les grilles mais le laisser pour le conteneur.

Answer 8

Vous utilisez ASP.NET, il vous suffit donc de charger les 4 contrôles dans une vue à plusieurs utilisateurs, puis de définir à la publication (postback) le contrôle visible de manière à sélectionner le bouton de votre choix.

http://msdn.microsoft .com / fr-us / library / system.web.ui.webcontrols.multiview.aspx

Answer 9

N'UTILISEZ PAS de cadres (ni d'iframes d'ailleurs) à moins que vous ne ne soyez absolument pas obligé (e) de ...

La seule raison valable pour laquelle je peux penser à utiliser (i) frames est en fait les commandes de téléchargement de fichier, et je ne suis pas sûr que ce soit valide là non plus ...