Gridview Tri avec des images

Question

J'ai une application Web (ASP.NET 2.0 avec C#), et dans ce que j'ai un gridview qui obtient ses données à partir d'une base de données Oracle. J'avais besoin d'implémenter la fonction de tri pour le gridview, donc j'ai ajouté un menu déroulant juste au-dessus de la gridview avec 2 choix: Ascending et Descending. Ensuite, dans la méthode Gridview_Sorting, j'ai une instruction switch qui vérifie essentiellement la sélection dans le menu déroulant, et trie en conséquence.

Cela fonctionne, mais je veux être capable de cliquer dessus une fois, et il trie dans un sens, puis de nouveau, et il trie dans l'autre sens. Une autre chose que j'aimerais avoir serait des images à côté des noms de colonne qui vous indiquent dans quelle direction les données sont triées.

Des suggestions? Merci.

Answer 1

Vérifiez cette blog post pour un sous-programme générique pour gérer cette

Answer 2

Une solution simple consisterait à utiliser un bouton de contrôle d'image ou d'image. Sur l'événement click, basculez l'image d'une image à l'autre. Pour déterminer l'état précédent, utilisez une variable de session ou déterminez à quelle propriété imageurl du bouton d'image a été précédemment définie, basculez-la et appelez votre méthode de tri.

Answer 3

J'utilise trieuse de table JQuery. tri côté client est plus rapide à l'extrémité avant et ce plugin vous permet de spécifier les images qui affichent dans les rubriques de vos colonnes:

http://tablesorter.com/docs/

Je ne suis pas sûr de ce que l'impact sera lorsque vous travaillez avec la sélection et de l'interaction avec cette méthode, alors méfiez-vous.

Answer 4

-je ajouter l'image à la cellule d'en-tête sur le tri:

// ... 

GridViewRow headerRow = GridView1.HeaderRow; 

foreach (TableCell tableCell in headerRow.Cells) 
{ 
    if (tableCell.HasControls()) 
    { 
     LinkButton button = tableCell.Controls[0] as LinkButton; 
     if (button != null) 
     {            
      if (sortExp == button.CommandArgument) 
      { 
       Image image = new Image(); 
       if (sortDir == "ASC") 
       { 
        image.ImageUrl = "/_layouts/Document LibraryManager/icon_ascending.gif"; 
        tableCell.Controls.Add(image); 
       } 
       else 
       { 
        image.ImageUrl = "/_layouts/Document LibraryManager/icon_descending.gif"; 
        tableCell.Controls.Add(image); 
       } 
      } 
     } 
    } 
} 

Answer 5

Le plus simple et élégante façon de le faire est d'utiliser ViewState. Conserver la direction de tri dans ViewState et y accéder à chaque fois qu'un tri est effectué.

public SortDirection GridViewSortDirection 
    { 
     get 
     { 
      if (ViewState["sortDirection"] == null || (SortDirection)ViewState["sortDirection"] == SortDirection.Descending) 
       ViewState["sortDirection"] = SortDirection.Ascending; 
      else if ((SortDirection)ViewState["sortDirection"] == SortDirection.Ascending) 
       ViewState["sortDirection"] = SortDirection.Descending; 

      return (SortDirection)ViewState["sortDirection"]; 
     } 
     set 
     { ViewState["sortDirection"] = value; } 
    } 

Si aucun tri a été fait précédemment (état null) ou la direction de tri précédent descendais, la prochaine fois que le tri devrait se produire dans l'ordre croissant. De même, vice-versa.