v2.5.2
Giriş yap

File input'dan dosya ismini text inputa gösterme post etmeden

darkwob
320 defa görüntülendi

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

Cevap yaz
Cevaplar (2)
h4ckdr0
551 gün önce
<!-- 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>