2010-07-26 7 views
7

Je dois afficher un ensemble de données dans un tableau sur un site Web dans le cadre d'un rapport. Le problème, c'est qu'il y en a beaucoup et qu'il faut les regrouper visuellement. Chaque donnée est une "utilisation" d'un article, et a une date (représentant quand il a été utilisé), un numéro de magasin (correspondant au magasin qui l'a utilisé), un nom d'article (l'article qui était utilisé) et une quantité (le montant de l'article utilisé).Triply groupé par données tabulaires - comment afficher?

L'utilisateur aura l'option de grouper par article, puis de stocker ou par magasin, puis article. Dans les coulisses, je vais également regrouper par date.

Le rapport doit additionner les quantités par article/magasin (en fonction de l'option grouper par) et par date, et additionner les sous-sommes.

La chose est, je ne suis pas sûr de savoir comment l'afficher. Le mieux que je peux trouver est en ce moment quelque chose comme

      ++------+------+------+------++-----+ 
          || date | date | date | date || sum | 
+-----------+--------------||======+======+======+======||=====+---+ 
| Item Name | Store Number || 1 | 2 | 3 | 4 || 10 |^| 
|   +--------------||------+------+------+------||-----|---| 
|   | Store Number || 5 | 6 | 7 | 8 || 26 | # | 
|   +--------------||------+------+------+------||-----| # | 
|   | Store Number || 9 | 10 | 11 | 12 || 42 | # | 
|   +--------------||------+------+------+------||-----| | 
|     Total || 15 | 18 | 21 | 24 || 78 | | 
+==========================++===========================++=====| | 
| Item Name | Store Number || 1 | 2 | 3 | 4 || 10 | | 
|   +--------------||------+------+------+------||-----| | 
|   | Store Number || 5 | 6 | 7 | 8 || 26 | | 
|   +--------------||------+------+------+------||-----| | 
|   | Store Number || 9 | 10 | 11 | 12 || 42 | | 
|   +--------------||------+------+------+------||-----|---| 
|     Total || 15 | 18 | 21 | 24 || 78 | v | 
+==========================++===========================++=====+---+ 
          | < | ####    | > | 
          +---------------------------+ 

Pour groupe par élément, puis magasin, ou un commutateur « Nom de l'élément » avec « Numéro Store » pour le groupe en magasin puis article.

Les colonnes de date (beaucoup plus que quatre) défilaient vers la gauche/droite et les éléments/magasins défilaient vers le haut/bas, pour conserver la table sur une page. En d'autres termes, les en-têtes de date sont figés verticalement et le nom de l'élément, les numéros de magasin et les sommes sont gelés horizontalement.

Le problème serait avec la mise en œuvre: comment diable je représente cela en HTML !? La meilleure question est: y a-t-il un meilleur moyen?

Quel est votre conseil pour résoudre ce problème? (De préférence avec élégance et facilement)

Répondre

1

Je pense que la meilleure solution consiste à regrouper les données par poste, comme l'image suivante http://img51.imageshack.us/img51/6434/layoutsv.png

Le code HTML serait quelque chose comme le folowing:

<div style="overflow: auto; width: 100%; height: 500px"> 
    <h1>Item 1</h1> 
    <table> 
     <tr> 
      <th></th> 
      <th>Date</th> 
      ... 
      ... 
     </tr> 
     <tr> 
      <th>Store #</th> 
      <td>1</td> 
      ... 
      ... 
     </tr> 
     ... 
     ... 
    </table> 
    <h1>Item 2</h1> 
    ... 
    ... 
</div> 

Pour la colonne fixe, vous devriez regarder ici: HTML table with fixed headers and a fixed column?

+0

C'est quelque chose auquel je n'ai pas pensé. J'ai tendance à rendre les choses trop compliquées: D. BTW, bienvenue à StackOverflow! –

+0

@Austin Merci! Bonne chance avec l'application! :) – cesarnicola

1

C'est faisable, mais je ne ferais pas cela directement en html moi-même. Aussi complexe que cela puisse être de le configurer en premier lieu, il sera compliqué de le modifier plus tard lorsque l'entreprise aura besoin d'être modifiée. Si vous essayez de le faire, je vous recommande d'examiner les concepts de tables empilées et intégrées, de divs de défilement et de divs à position fixe/superposée. Même ainsi, il ne sera pas amusant d'essayer d'obtenir quelque chose de si complexe dans plus d'un type de navigateur.

Je vous recommande d'examiner certains outils de plus haut niveau. ASP.NET a quelques bons contrôles pour cela si vous voulez toujours adopter une approche quelque peu manuelle. Ils ont des contrôles intégrés, qui peuvent être modifiés dans le code, ou vous pouvez coder (par opposition aux tableaux de balisage), tout en profitant du modèle d'événement pour interroger/re-interroger la base de données. Mieux encore, vous pouvez regarder un outil de reporting comme SSRS (et il y en a beaucoup d'autres), ou même MS Access pour les besoins de base.

+0

Merci pour les conseils. Vraiment, cela s'adresse à un très petit public (moins de 5 ans), avec des navigateurs conformes aux normes (hallelujah!). Malheureusement, j'utilise PHP comme backend, donc ASP sort, et SQLite, donc SSRS/Access est sorti. Peu importe comment je vais, je vais certainement générer la table dynamiquement d'une manière ou d'une autre, que ce soit JavaScript ou PHP. Du bon côté, les contrôles ASP ne sont que des morceaux HTML préfabriqués, donc s'ils peuvent le faire, je peux le faire ... –

Questions connexes