When uploading, the file name becomes the title

Asked

Viewed 89 times

1

Colleagues.

Is it possible for the user to upload a file, the file name to turn the page title? For example:

The user will fill out a form where the first field is the file upload and the second field is an input text. When he selects the file by uploading "materia_matematica.pdf", automatically fill in the input text "Mathematical Matter".

That’s possible?

javascript jquery ajax

2 answers

2

Javascript-enabled:

<html>
    <head>    
    </head>
    <body>
        <input id="arquivo" type="file" >

    <script>
        document.getElementById("arquivo").onchange = function(){
            var name = this.value.replace(/.*[\/\\]/, ''); // limpar nome para chrome
             document.title = name.split(".")[0];
        };
    </script>
    </body>
</html>
  • 1

    Thank you Lucas Costa

1


You can do it like this:

$('#file').on('change', function() {
  var f_name = $(this)[0].files[0].name;
  $('#name_file').val(f_name);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="file" id="file">
<input type="text" id="name_file">

And to change the page title dynamically you can do:

$('#file').on('change', function() {
  var f_name = $(this)[0].files[0].name;;
  document.title = f_name;
});

  • Perfect Miguel, very good. Just one more thing, how would you take the title extension?

  • 1

    @Fox.11, I might add, I didn’t understand if you wanted the input or the title

  • Thank you Miguel.

  • You’re welcome to @Fox.11. I’m glad you solved it, so you can access several things related to the file, e.g.: $(this)[0].files[0].type; that gives "image/jpeg" and how many data

Browser other questions tagged javascript jquery ajax

You are not signed in. Login or sign up in order to post.