I have a working code to pass value from one id to another, but to do that I need a button to pass it onclick. I want to pass the value without a button directly to the other input. As I did my research i just saw onclick solutions.. Is there any other way or am I stuck with this option
My Code:
window.onload = function() {
document.getElementById('button').onclick = function() {
document.getElementById('email2').value = document.getElementById('email').value;
document.getElementById('firma2').value = document.getElementById('firma').value;
document.getElementById('name2').value = document.getElementById('name').value;
document.getElementById('nummer2').value = document.getElementById('nummer').value;
}
};
Try this solution:
const textInput = document.querySelector('#text');
const checkboxInputs = document.querySelectorAll('[id^=checkbox]');
const secondInput = document.querySelector('#second');
const thirdInput = document.querySelector('#third');
textInput.addEventListener('input', (e) => {
secondInput.value = e.target.value;
})
textInput.addEventListener('change', (e) => {
thirdInput.value = e.target.value;
})
const checkboxesSet = new Set();
checkboxInputs.forEach(checkboxInput =>
checkboxInput.addEventListener('change', (e) => {
const label = document.querySelector(`label[for=${e.target.id}]`).innerText;
checkboxesSet[e.target.checked ? 'add' : 'delete'](label);
const text = [...checkboxesSet].join(', ');
secondInput.value = text;
thirdInput.value = text;
})
)<label for="text">Text input</label>
<input id="text">
<br/>
<label for="checkbox1">Checkbox input 1</label>
<input id="checkbox1" type="checkbox">
<br/>
<label for="checkbox2">Checkbox input 2</label>
<input id="checkbox2" type="checkbox">
<br/>
<label for="second">While typing</label>
<input id="second">
<br/>
<label for="third">At the end</label>
<input id="third">You could consider using onchange instead of onclick.