Comment fournir des contrôles pour diverses actions sur une seule page?

Question

Celui-ci est pour CMS. L'utilisateur doit pouvoir ajouter, supprimer, mettre à jour et rechercher dans un tableau sur une seule page.

Les boutons

Initialement, ADD est visible,
Si le bouton edit pencil icon Est cliqué, seul le bouton UPDATE est visible,
Si l'une des cases est cochée, seul le bouton DELETE SELECTED Sera visible

La boîte "message/formulaire pour modification"

1. Il montre les accusés de réception de toutes les actions (comme ligne (s) supprimée avec succès! )
2. Il montre un formulaire pré-rempli pour la mise à jour sur le clic du edit pencil icon
3. Il affiche des informations sur la ligne au clic du heading respectif dans le tableau

Maintenant, où et comment puis-je adapter les contrôles de recherche sans encombrer la page? La recherche est basée sur plusieurs paramètres et aura donc plusieurs entrées. Des idées s'il vous plait? Toute réflexion sur la disposition actuelle est également la bienvenue.

Answer 1

Quelques réflexions sur le design.

• Utiliser l'en-tête de sélection comme contrôle pour l'action Tout sélectionner/Effacer la sélection
• Combinez les colonnes Titre et Lien
• Réorganisez les actions rares/dangereuses en les supprimant de chaque ligne et en les appliquant à la sélection uniquement. Il crée un chemin plus long pour éliminer les erreurs et les glissades
• Utilisez des boîtes de dialogue contextuelles pour Ajouter, Modifier, Recherche avancée pour isoler les interactions complexes
• Afficher des informations supplémentaires sur la ligne sélectionnée près de la sélection (sur place plutôt qu'à position fixe en haut)
• Utilisez des messages qui disparaissent, ils chevauchent le contenu mais disparaissent automatiquement ou sont fermés par l'utilisateur. C'est non seulement plus naturel, mais économise également de l'espace.
• Ne cachez pas les outils principaux, car cela nécessite plus de charge cognitive pour découvrir les règles cachées.

Answer 2

1. Introduisez les critères de recherche. L'utilisateur peut saisir tout ou partie des champs dans les critères et cliquer sur le bouton Rechercher . La grille/le tableau ci-dessous sera actualisé à chaque clic sur le bouton Rechercher .

2. La sélection d'une ligne dans la grille/tableau affichera les détails de la ligne dans le cadre ci-dessous Détails .

3. Si l'utilisateur souhaite ajouter un enregistrement, il clique sur le bouton Nouveau . Il montre un cadre vide Détails . Une fois que l'utilisateur a entré les détails, il clique sur le bouton Ajouter

4. Si l'utilisateur sélectionne l'option Supprimer dans n'importe quelle ligne du tableau, les détails de la ligne correspondante sont affichés dans les Détails le cadre et l'utilisateur peuvent cliquer sur le bouton Supprimer la sélection pour supprimer définitivement l'enregistrement.

5. Si l'utilisateur sélectionne l'option Modifier dans n'importe quelle ligne du tableau, les détails de la ligne correspondante sont affichés dans les Détails le cadre et l'utilisateur peuvent cliquer sur le bouton Mettre à jour après avoir modifié les détails existants.

J'espère que cela vous sera utile ...