j0hnik, не порите хрени, ID = идентификатор, еще не означает, что нужно именно по нему обращаться к объекту. В данном случае ID, это зло.
Сообщение от ФедорН
|
Правильно ли я понимаю, что я document.querySelector("#id") должен заменить на что-то вроде width=document.querySelector("#form" input[name=width[]]) ?
|
Нет. document.querySelector(selector) вернет первый из набора. Если он один на странице, то все Ок, но если их много, то достучаться до остальных этим методом не получится. И к тому же селектор в данном случае, это строка, которая у вас с ошибкой прописана. Селектор "#form input[name=width[]]" не найдет требуемого, будет получена ошибка о некорректном селекторе, так как квадратные скобки в именах, а также точку необходимо экранировать - "#form input[name=width\\[\\]]" или "#my\\.iden" в случае идентификатора.
Но даже используя корректные селекторы и document.querySelectorAll() все равно не получится, так как элементы добавляются динамически, ранее объявленные обработчики их не затронут. Нужно делегировать обработку родителю form.
$('#form').on('change input', 'select, input', function() {
this.value //здесь, это значение источника, а
this //сам источник, который нужно исключить из набора остальных получаемых элементов
var elm = $(this).closest('.roword').find('select, input').not(this) //набор остальных
})
Можно в набор включить сразу и output, перемножая значения среза элементов 0, -1 и this, помещая результат в последний в наборе (то есть output).
Кроме события change родителю делегируется обработка и события input, так как в поле ввода можно изменять значение не только стрелками, но и непосредственно вводом значения.
Ранее показанный код добавления нужно исправить, забыто об output, кроме того, по уму, поля ввода должны иметь значение по умолчанию 40 (в атрибутах min="40" max="200 и 300").
$('button').click(function() {
$('div.roword').first()
.clone()
.appendTo($('#form'))
.find('select, output').val('')
.end()
.find('input')
.val(40)
});
Но и это еще не все. Если я добавил еще полей, то это еще не означает, что я буду делать в них выбор и отправлять, а значит у пользователя должна быть возможность удаления добавляемых полей.