File input'dan dosya ismini text inputa gösterme post etmeden
Merhabalar Bir şey merak ediyorum yapılabilir mi diye, file inputuna seçtiğimiz bir dosyanın ismini Sunucuya yüklemeden önce text inputa göstermek mümkün mü ? böylece kullanıcı ya da admin isim yazmakla uğraşmayacak ve dosyanın ya da resmin ismini görebilecek
<!-- file form oluştur -->
<form action="#" method="post" enctype="multipart/form-data">
<input type="file" name="file">
<input type="text" name="file_name">
<button type="submit" name="submit">Yükle</button>
</form>
<!-- js ile file input'tan dosya adını parçala ve text inputuna yaz -->
<script>
const fileInput = document.querySelector('input[type="file"]'); // file input
const textInput = document.querySelector('input[name="file_name"]'); // text input
fileInput.addEventListener('change', () => { // file input'ta değişiklik olduğunda
let fileName = fileInput.value.split('\\'); // file input'tan dosya adını parçala
fileName = fileName[fileName.length - 1]; // parçalanan dosya adını
textInput.value = fileName; // text input'a yaz
});
</script>