Пересортировать ячейки таблицы

[botyaslonim]

Привет всем!

Есть таблица вот примерно такого вида:

Нужно привести её к такому виду:

То есть место ячейки в строке должно быть одинаковым, если одинаковое содержание, либо оставить ячейку пустой.

Что-от у меня никак не выходит. Получаются какие-то переборы двойной вложенности, но всё некрасиво и громоздко. Может, есть более изящное решение?

[nerv]

Есть таблица вот примерно такого вида:

Нужно привести её к такому виду:

ну а логика где?

[botyaslonim]

В смысле? Из рисунка не очень ясно, что нужно сделать?

Лыжи под лыжами, санки под санками, и т.д. Смысл - ячейкам со сходной информацией назначить одно и то же расположение относительно начала строки таблицы.

[SelenIT]

Первая строка всегда полная и может служить образцом? Или не обязательно?

[botyaslonim]

Да, скрипт сначала формирует первую строку. Примем её за эталон. Всегда полная.

Edited December 13, 2012 by botyaslonim

[SelenIT]

Скрипт? А сразу сортировать всё остальное этот же скрипт не может?

[botyaslonim]

Нет! Или зачем, по-вашему, я помощи форума прошу

Скрипт я пишу.

[SelenIT]

Я просто было подумал, что речь о серверном скрипте, формирующем исходную таблицу. Это не так? Откуда исходная таблица берется?

[botyaslonim]

Думаю, это не имеет значения, а то мы зароемся в детали. Исходная таблица берётся из Joomla K2, изначально всё вразнобой. Пузырьковой сортировкой вывел вверх самую длинную строку, дорисовал более коротким пустые ячейки (до нужного числа ячеек, равного числу ячеек самой длинной). Цель - построить таблицу шириной в самый длинную строку, с логичными столбцами.

Но мне интересно решить именно эту задачу, когда уже нужно сделать из рисунка 1 рисунок 2. В дальнейшем, думаю, пригодится.

Edited December 13, 2012 by botyaslonim

[SelenIT]

Тогда я бы сделал ассоциативный массив вхождений каждой категории, типа

var entries = {
   шапки: {
     1: "шапки", 3: "шапки"  // номер строки - содержимое соотв. ячейки
   },
   лыжи: {
     1: "лыжи", 2: "лыжи"
   },
   ...
}

а потом обходил бы циклом а-ля

for (var i=1; i<=rows.length; i++) {
   html += '<tr>';
   for (var category in entries) {
      if (entries[category][i]) {
          html += '<td>' + entries[category][i] + '</td>';
      }
      else {
          html += '<td></td>';
      }
   }
   html += '</tr>';
}
target.innerHTML = '<table>' + html + '</table>';

(набросал на скорую руку, не проверял и тем более не оптимизировал, чисто для иллюстрации идеи)

[botyaslonim]

Спасибо! Попробую применить!

[nerv]

То есть место ячейки в строке должно быть одинаковым, если одинаковое содержание, либо оставить ячейку пустой.

в столбце

какой вопрос, такой ответ

var table = document.getElementsByTagName( 'table' )[ 0 ];
var pattern = Array.prototype.map.call( table.rows[ 0 ].cells, function( cell, index ) {
    return cell.innerHTML;
});

Array.prototype.slice.call( table.rows, 1 ).forEach( function( row ) {

    var data = Array.prototype.map.call( row.cells, function( cell, index ) {
        return cell.innerHTML;
    });
    var newData = pattern.map( function( item ) {
        return ~data.indexOf( item ) ? item : '';
    });

    Array.prototype.forEach.call( row.cells, function( cell, index ) {
        cell.innerHTML = newData[ index ];
    });

});

UPD: чет голова на ночь совсем не варит. Можно проще

var table = document.getElementsByTagName( 'table' )[ 0 ];
var pattern = Array.prototype.map.call( table.rows[ 0 ].cells, function( cell, index ) {
    return cell.innerHTML;
});

Array.prototype.slice.call( table.rows, 1 ).forEach( function( row ) {

    var data = Array.prototype.map.call( row.cells, function( cell, index ) {
        return cell.innerHTML;
    });

    pattern.forEach( function( item, index ) {
        row.cells[ index ].innerHTML = ~data.indexOf( item ) ? pattern[ index ] : '';
    });

});

Edited December 14, 2012 by nerv

[botyaslonim]

nerv, спасибо, работает!

Вопрос следующий. Можно ли сделать пересортировку этим же методом, но для таблицы такого вида:

Некоторые важные детали вопроса выслал в личку

[nerv]

botyaslonim, ответил в личку

[botyaslonim]

Nerv, SelenIT - спасибо за участие!