Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 18.02.2017, 13:59
Новичок на форуме
Отправить личное сообщение для abcde_007 Посмотреть профиль Найти все сообщения от abcde_007
 
Регистрация: 18.02.2017
Сообщений: 3

Клонировние элементов, изменение содержимого
Добрый всем день. Скорее всего, вопрос будет удивлять своей "новизной", но что-то ответа на него я так и не нашел. Задача на raw js на странице клонировать форму, но попутно добавляя/изменяя содержимое.
Задача - вставить кнопку "удалить" куда надо. Работает только при варианте представленном ниже. А надо вставить внутрь клонированной формы. Все попытки вытащить элемент (parent_del_elem) из клонированного узла, чтобы к нему присоединить кнопку, ни к чему не приводят. Выдает ошибку в консоли.
В чем моя ошибка? Почему не работает var most_wanted = cloned.selectElementById('parent_del_elem') ?
<div class="1 2 3" id="clone_elem">
		<div class="2 5" id="parent_del_elem">
			<form >
				<input type="text" name="">
				<input type="password" name="">
				<button type="submit" id="">Submit </button>
			</form>
				<button type="submit" id="">Добавить</button>
		</div>
		
	</div>

window.onload = function () {
	add.onclick = function () {

		var button = document.createElement('button');
		var parent_del_elem = document.getElementById('parent_del_elem');
        button.innerHTML = 'Удалить';

		var original = document.getElementById('clone_elem');
		var cloned = original.cloneNode(true);

		cloned.appendChild(button);

		original.parentNode.insertBefore(cloned, original.nextSibling);
	}
}

Последний раз редактировалось abcde_007, 18.02.2017 в 14:05.
Ответить с цитированием
  #2 (permalink)  
Старый 18.02.2017, 15:46
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,124

Сообщение от abcde_007
selectElementById
что это?
Ответить с цитированием
  #3 (permalink)  
Старый 18.02.2017, 15:52
Новичок на форуме
Отправить личное сообщение для abcde_007 Посмотреть профиль Найти все сообщения от abcde_007
 
Регистрация: 18.02.2017
Сообщений: 3

Сообщение от рони Посмотреть сообщение
что это?
Конечно getElement, опечатка

Сообщение от Malleys Посмотреть сообщение
В 8-ой строке, там где HTML, пропущен id add
Да, тоже опечатка.
Не с той вкладки скопипастил, извиняюсь.
Ответить с цитированием
  #4 (permalink)  
Старый 18.02.2017, 16:30
Новичок на форуме
Отправить личное сообщение для abcde_007 Посмотреть профиль Найти все сообщения от abcde_007
 
Регистрация: 18.02.2017
Сообщений: 3

Сообщение от Malleys Посмотреть сообщение
Оно работает!!! Добавляет!
Пример сверху да, рабочий. Вопрос не в нем. А в том, что нужно изменить внутри клонированной части. Добавить кнопку 'удалить' не за клонированным дивом, а ВНУТРИ него.
Ответить с цитированием
  #5 (permalink)  
Старый 18.02.2017, 17:02
Аватар для Malleys
Профессор
Отправить личное сообщение для Malleys Посмотреть профиль Найти все сообщения от Malleys
 
Регистрация: 20.12.2009
Сообщений: 1,714

В 8-ой строке, там где HTML, пропущен id add

Оно работает!!! Добавляет!

В данном случае необходимо использовать классы вместо идентификаторов...

https://jsfiddle.net/cz5r1qqf/2/

Последний раз редактировалось Malleys, 20.03.2019 в 11:37.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Изменение css стилей в зависимости от количества элементов spaiker2009 Элементы интерфейса 1 30.09.2015 23:23
Изменение размера и перемещение элементов Nupster Элементы интерфейса 2 12.08.2014 19:38
запретить изменение количество элементов в списке Antistas jQuery 0 05.12.2012 14:05
Изменение множества элементов Input по определённом призна Лавсановые Волокна Элементы интерфейса 1 24.12.2010 10:37
Частичное изменение содержимого элемента kuhok Events/DOM/Window 28 07.09.2009 22:44