Трижды сгруппированные по табличным данным - как отобразить?

Question

Мне нужно отобразить кучу данных в таблице на веб-сайте как часть отчета. Проблема в том, что их много, и их нужно визуально сгруппировать.

Каждый фрагмент данных является «использованием» предмета и имеет дату (представляющую, когда он использовался), номер магазина (соответствующий магазину, который его использовал), название предмета (предмет, который использовался ) и количество (количество использованного товара).

У пользователя будет возможность сгруппировать по элементу, затем сохранить или по магазину, затем элемент. За кулисами я также буду группировать по дате.

В отчете необходимо суммировать количества как по товарам / магазинам (в зависимости от варианта группировки), так и по дате, а также итоговые суммы.

Дело в том, что я не уверен, как это отобразить. Лучшее, что я могу придумать сейчас, это что-то вроде

                           ++------+------+------+------++-----+
                           || 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 |
+==========================++===========================++=====+---+
                            | < | ####              | > |
                            +---------------------------+

Для группировки по элементу затем сохраните или переключите «Имя элемента» на «Номер магазина» для группы по элементу после сохранения.

Столбцы даты (гораздо больше, чем только четыре) будут прокручиваться влево / вправо, а предметы / магазины будут прокручиваться вверх / вниз, чтобы таблица оставалась на одной странице. Другими словами, заголовки даты заморожены на месте по вертикали, а имя элемента, номера магазинов и суммы заморожены по горизонтали.

Проблема будет в реализации: как, черт возьми, я это представляю в HTML!?

Лучший вопрос: есть ли лучший способ?

Что вы посоветуете для решения этой проблемы? (желательно элегантно и легко)

Answer 1

Я думаю, что лучшее решение - сгруппировать данные по элементам, как показано на следующем рисунке http://img51.imageshack.us/img51/6434/layoutsv.png

HTML-код будет выглядеть примерно так:

<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>

Для фиксированногостолбец, который вы должны посмотреть здесь: HTML-таблица с фиксированными заголовками и фиксированным столбцом?

Answer 2

Это выполнимо, но я бы не стал делать это непосредственно в html. Как бы сложно это ни было настроить в первую очередь, просто будет сложно изменить его позже, когда потребуются изменения в бизнесе.

Если вы в конце концов попробуете это, я бы порекомендовал изучить концепции суммированных и встроенных таблиц, прокрутки div и div с фиксированным положением / перекрытием. Несмотря на это, будет неинтересно пытаться заставить что-то такое сложное работать в более чем одном типе браузера.

Я бы порекомендовал изучить некоторые инструменты более высокого уровня. ASP.NET имеет несколько хороших элементов управления для этого, если вы все еще хотите использовать несколько ручной подход. Они имеют встроенные элементы управления, которые можно изменять в коде, или вы можете кодировать (в отличие от разметки) таблицы, и при этом использовать модель событий для запроса / повторного запроса к базе данных.

Еще лучше, вы могли бы взглянуть на инструмент отчетности, такой как SSRS (и многие другие), или даже MS Access для базовых потребностей.