Показать сообщение отдельно
  #14 (permalink)  
Старый 03.02.2016, 14:55
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

Красивые таблички, это уже не мое дело, а вот как построить на клиенте табличку из данных, это можно показать, хотя это действо на клиенте ничем по сути не будет отличаться от подобного на сервере. Разница может быть только в случае работы на клиенте с DOM, а не создания строки html кода таблицы, а потом помещения ее на страницу. Хотя и в случае работы с DOM получение данных из объекта ничем не будет отличаться и при формировании строки.

Но прежде чем строить "красивую табличку", нужно озаботиться чтобы данные для этой таблички были в удобном для клиента формате. А если посмотреть на массив данных на сервере, то видим в нем кроме полезного и кучу мусора (_related:yii\db\BaseActiveRecordrivate, _errors:yii\base\Modelrivate и другие). Более того, каждый вложенный массив объекта app\models\LogBonus Object содержит два вложенных массива _attributes:yii\db\BaseActiveRecordrivate дублирующих друг друга или вы этого не замечаете? И какие же в этом случае данные будет содержать "красивая табличка" на клиенте?

Опять предположим, что все эти проблемы предварительно решены на сервере и клиенту не передается в итоге мусора и дубликатов. Но еще один вопрос остался без ответа - все ли данные массива _attributes:yii\db\BaseActiveRecordrivate нужно отображать на клиенте или же просто выдрано из базы все что есть и отправлено клиенту? А ведь если нужно не все, то придется на клиенте идентифицировать только те свойства объекта, которые нужно поместить в таблицу, а это бесполезная работа в таком случае будет.

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

Предположим, что из всех ключей вложенных массивов _attributes:yii\db\BaseActiveRecordrivate на клиенте нужно отобразить лишь некоторые. Для этого правильнее всего определять в запросе к базе только эти поля. Если это является проблемой, то можно получить срез массива, можно получить пересечением массивов нужные ключи, а можно в цикле формировать новый массив только тех данных, которые и будут отправлены клиенту.

И опять предположим, что с этим все ОК и клиенту отправляются только необходимые данные, и пусть для примера возьмем эти:

Код:
Array
(
    [0] => Array
        (
            [oper] => Оплата по Заказ наряд 18930 (26.09.12) / 7079
            [oper_summa] => 7079.00
            [dat_oper] => 2012-09-26 13:20:00
        )

    [1] => Array
        (
            [oper] => Оплата по Заказ наряд 27303 (19.10.13) / 6399
            [oper_summa] => 210.00
            [dat_oper] => 2013-10-19 12:35:55
        )

)
Отдав эти данные клиенту как json, и вот так:

json_encode($array, JSON_UNESCAPED_UNICODE | JSON_NUMERIC_CHECK)


после их преобразования в объект, получим:

html = [
    {"oper" : "Оплата по Заказ наряд 18930 (26.09.12) / 7079", "oper_summa" : 7079, "dat_oper" : "2012-09-26 13:20:00"},
    {"oper" : "Оплата по Заказ наряд 27303 (19.10.13) / 6399", "oper_summa" : 210, "dat_oper" : "2013-10-19 12:35:55"}
];


Но прежде чем отдавать именно такую структуру данных полезно бы призадуматься. Нам нужно только построить таблицу из этих данных, то есть поместить значения свойств объектов этого массива в ячейки таблицы, имена самих свой не нужны. Можно конечно пробежать циклом по этому массиву/объектам, получить значения свойств и сформировать таблицу. Можно, но зачем, если можно обойтись без этого.

На сервере средствами РНР можно обрамить элементы массива тегами ячейки таблицы, сформировав код таблицы и делается это просто, вариант с циклом:

echo '<table>';
foreach($array as $v) echo '<tr><td>' . implode('</td><td>', $v) . '</td></tr>';
echo '</table>';


При этом не важно каким массивом является $v, ассоциативным или индексным, в любом случае implode() будет оперировать со значениями массива.

В JS функция аналогичная implode(), это join(). Но она применима только к массивам, а ассоциативный массив отданный клиенту будет представлять на нем как Объект, и нельзя будет так же просто в цикле получать объект, и применить к нему join:

'<tr><td>' . html[i].join('</td><td>') . '</td></tr>' - это ошибка, так как html[i] в массиве объектов, это объект.

Отсюда вывод, что для "просто вывести данные в таблице на клиенте" выгоднее отправлять ему только данные, то есть индексный массив, вот такой:

Код:
Array
(
    [0] => Array
        (
            [0] => Оплата по Заказ наряд 18930 (26.09.12) / 7079
            [1] => 7079.00
            [2] => 2012-09-26 13:20:00
        )

    [1] => Array
        (
            [0] => Оплата по Заказ наряд 27303 (19.10.13) / 6399
            [1] => 210.00
            [2] => 2013-10-19 12:35:55
        )

)
И на клиенте получим не массив объектов, а массив массивов, вот что будет содержать переменная html в ответе на запрос:

html = [
    ['Оплата по Заказ наряд 18930 (26.09.12) / 7079', '7079.00', '2012-09-26 13:20:00'],
    ['Оплата по Заказ наряд 27303 (19.10.13) / 6399', '210.00', '2013-10-19 12:35:55'] 
];


Теперь и на клиенте можно упростить задачу построения таблицы, получая в цикле каждый вложенный массив массива html и посредством join() формировать строку таблицы.

Но колонки таблицы еще и имеют заголовки поясняющие данные. Здесь опять неизвестно, то ли если фиксированные данные отдаются клиенту и одноразовые, то есть сценарий на клиенте строящий эту таблицу, строит только ее, а значит эти заголовки жестко прописаны в сценарии, а строки таблицы получаемые из данных нужно добавить в таблицу, то ли клиент может получать различные таблицы с различными данными. Во втором случае заголовки таблиц выгоднее не прописывать жестко в сценарии, а получать их также от сервера наряду с данными таблиц, и иметь один и тот же сценарий на клиенте строящий по ним таблицы.

При этом на сервере можно поступить по разному, как способ, иметь массив описывающий заголовки таблиц и отдавать те, что удовлетворяют параметру запроса. Но самое разумное, это источником заголовков является сам источник данных. Поля таблиц могут иметь комментарии описывающие их. Эти комментарии можно получить запросом к базе:

Код:
'SELECT COLUMN_NAME, COLUMN_COMMENT 
FROM INFORMATION_SCHEMA.COLUMNS WHERE TABLE_SCHEMA = "base_name" 
AND TABLE_NAME = "table_name"'
и по ключам запрашиваемых полей данных (COLUMN_NAME), получить из этого запроса комментарии этих полей (COLUMN_COMMENT), при этом данные клиенту можно передать так:

Код:
array = [
  'head' => [массив описывающий колонки таблицы],
  'data' => [
    [массив значений],
    [массив значений],
    [массив значений],
    ....
  ]
]
на клиенте из html.head массива строим строку заголовков таблицы (посредством того же join()), а обходом в цикле массива html.data строки таблицы с данными.

Примечание - если читаем это и не понимаем, то:

1) показать конкретное представление данных получаемых клиентом
2) данные не должны иметь дубликатов, мусора и ненужных данных (см. выше)
3) если п. 2 не выполняется, описать условия - какие именно данные должны быть помещены в таблицу на клиенте.

PS. Колобки с языком, это следствие ВВ, а не данные из базы, надеюсь понятно будет о каких именно речь.

Последний раз редактировалось laimas, 03.02.2016 в 20:27.
Ответить с цитированием