Поиск элемента в копии таблицы(cloneNode(true))
Добрый день!
Задача следующая, есть некоторая таблица с множеством вложений, их количество и порядок нам неизвестен, нам известно только ID таблицы. Вся эта таблица должна храниться в переменной. Делаю так: function savePatternTable(ID) { if(MULTI[ID]) { Counts[ID]=1; MULTI[ID]=document.getElementById(ID).cloneNode(true); //сохраняем копию таблицы } } Далее мне необходимо найти элемент в этой копии(чтобы изменить его), известен только ID элемента, и ID копии таблицы. как можно реализовать такое? причем уровень вложенности элементов в таблице может быть бесконечно велик. Буду благодарен за любую помощь, намек или подсказку:) |
Во время копирования, приписывайте префикс к имени идентификатора, иначе document.getElementById(...) будет выдавать первый найденый элемент с таким идентификатором и неважно есть этот элемент в дереве или нет.
|
Это то понятно:) так уже делается в самом html. Но вот в чем суть, таблице разные по структуре, но у всех у них, есть скажем поле name примерно такого значение: TABLE_TITLE_{ID_ROOT_TABLE}....
Так поясню подробнее задачи, пытаюсь реализовать механизм размножения таблиц(таблицы различаются). Изначально на странице появляется по одной таблице каждого типа, после загрузки каждой уникальной таблицы запускается savePatternTable('{ID_ROOT_TABLE}') - сохраняем исходное состояние каждой уникальной таблицы(таблицы имеют элементы ввода,которые могут изменятся). ID_ROOT_TABLE - это ID уникальной таблицы, для первой оригинальной таблицы примерно такого вида: CUT_IMAGE[0]..... Теперь нажав плюсик возле какой-то таблички, у нас под ней должна появится ее копия, только все ID в этой копии, должны быть изменится, например для первой копии: CUT_IMAGE[1]. Дык вот получается такая задача, что сохранив копию уникальной таблицы, для добавления ее экземпляра на страницу, нужно пройтись по сохраненной копии и заменить все ID на другие. Задача в прицнипе тривилаьная, если точно знаем уровень вложенности элементов в таблицу. Но в моем случае это не так, все таблицы кардинально отличаются друг от друга как по уровню вложенности элементов, так и по их количеству.Едиснтвенное что нам известно, так это массив ID которые мы должны изменить, примерно в таком виде: Array('CUT_IMAGE','IMAGE_WIDTH','IMAGE_HEIGHT'), а также номер последней добавленной на страницу копии таблицы(под которой нажали плюс). Кратко говоря алгоритм такой: на старте есть несколько уникальных таблиц, сохраняем их структуру и первоначальные значения элементов ввода в шаблон(MULTI[ID]), далее чтобы создать еще один экземпляр какой-то таблицы, копируем шаблон соответствующий ей, проходим по всем необходимым нам ID в этой копии шаблона и меняем циферку в [] на значение Counts[ID], затем выводим копию шаблона, и прибавляем единицу к Counts[ID] |
Ну не используйте идентификаторы, раз не хотите их вручную менять, есть куча других способов найти узел в DOM-дереве
|
Хм.... я совсем слаб еще в javascript и о других методах незнаю:(((.... Могли бы вы подсказать примерчик, или где можно прочесть. решение вот такой вот конкретной задачи:
Есть одна оригинальная таблица(IMAGE_TABLE[0] ее ID), она лежит в форме, в таблице есть поля(при чем мы понятия не имеем где, на каком уровне вложенности, в обычном td или в еще одной таблице): <input type='text' name='WIDTH[0]' value='100'><!-- 100 значение по умолчанию --> <input type='text' name='HEIGHT[0]' value='100'><!-- 100 значение по умолчанию --> Вот мы ввели туда 400 и 300 в WIDTH[0] и HEIGHT[0] соответственно. Далее решили, что одного изображения нам будет мало, и нажали плюсик под этой таблицей. Ниже первой таблицы, появилась ее копия, но с одним "НО", элементы она имеет такие: <input type='text' name='WIDTH[1]' value='100'><!-- 100 значение по умолчанию --> <input type='text' name='HEIGHT[1]' value='100'><!-- 100 значение по умолчанию -->[/htnl] , а ID у ней уже должен стать IMAGE_TABLE[1] ВО второй таблице тоже ввели какие то данные, и решили, что никак и без третьего изображения. Нажимаем еще раз плюс. И у нас оявляется, третий экзмепляр таблицы, но уже с такими полями: [html]<input type='text' name='WIDTH[2]' value='100'><!-- 100 значение по умолчанию --> <input type='text' name='HEIGHT[2]' value='100'><!-- 100 значение по умолчанию --> ,и с ID = IMAGE_TABLE[2] ================================================== =========== Все что нам дается при старте: Код:
var MULTI=new Array( Как мне менять name, при создании каждой копии таблицы? Заранее спасибо! |
В именах идентификаторов нельзя использовать квадратные скобочки.
В вашем случае лучшим вариантом будет не хранить копию таблицы, а пересоздавать её заново методами DOM (createElement, insertCell, insertRow и т.д.) или простой конкатенацией строк, используя, для формирования имен и идентификаторов, переменную-индекс. |
Часовой пояс GMT +3, время: 06:18. |