Почему возникает ошибка
Cannot read property 'forEach' of undefined
Когда присвоение находится в методе init
.
this.inputs = document.querySelectorAll('[form="deleteMany"]')
Но, если перенести присвоение в метод selectAll
все работает.
window.addEventListener('load', function() {
var selector = {
input: null,
inputs: null,
selected: false,
init(elemId) {
this.input = elemId ? elemId : "js-select-all";
this.inputs = document.querySelectorAll('[form="deleteMany"]');
this.addEvent();
},
addEvent() {
document.getElementById(this.input).addEventListener('change', this.selectAll);
},
selectAll() {
if (!this.selected) {
this.inputs.forEach(e => e.checked = true);
this.selected = true;
return;
}
this.inputs.forEach(e => e.checked = false);
this.selected = false;
}
};
selector.init('js-select-all');
console.log(selector.inputs);
});
<table>
<thead>
<tr>
<td><input id="js-select-all" type="checkbox"></td>
</tr>
</thead>
<tbody>
<tr>
<td><input form="deleteMany" type="checkbox"></td>
</tr>
<tr>
<td><input form="deleteMany" type="checkbox"></td>
</tr>
<tr>
<td><input form="deleteMany" type="checkbox"></td>
</tr>
</tbody>
</table>