mcfc4heatons
New Coder
Hello - I want to take the filename from a file input and then populate in some text inputs, doesn't work correctly and only one text input is populated:
Code:
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<form>
<input type="file" id="fileinput"><br>
<input type="text" id="textinput_1" class="countme"><br>
<input type="text" id="textinput_2" class="countme"><br>
<input type="text" id="textinput_3" class="countme"><br>
<input type="text" id="textinput_4" class="countme">
</form>
<script>
const countAll = document.querySelectorAll('.countme').length; // Count elements
console.log(countAll); // 3
for (let i = 1; i < countAll; i++) {
const textinput = document.getElementById('textinput_' + i); // textinput_1, textinput_2, etc
document.getElementById('fileinput').oninput = function() {
textinput.value = document.getElementById('fileinput').files[0].name;
}
}
</script>
</body>
</html>