php upload auto submit after browse a file

Question

I want to make a simple site that would let you browse for an mp3 and upload it automatically.

here is my code

<?php

if(isset($_POST['submit'])){
$file = $_FILES['mp3']['name'];
$tmp = $_FILES['mp3']['tmp_name'];
echo "$file";
move_uploaded_file($tmp, "member/mp3/".$file);
echo"Success";

}
    ?>

    <html>

<form enctype="multipart/form-data" method="POST" action="upload.php">

<input type="file" name="mp3" /><br />
<input type="submit" name="submit" value="Upload" />
</form>

 </html>

This code here is my original attempt however this still uses a manual form.

How can I make this upload automatically?

Just to point it out, if somebody did something like naming their file ("~/../../../etc/someFile"), you could be potentially allowing somebody to overwrite a bunch of your files. — thatidiotguy
– thatidiotguy, Commented Dec 4, 2012 at 20:28
@thatidiotguy Aren't "/" invalid characters in a file name? Or is that just certain OS's? Or am I crazy? — Ian
– Ian, Commented Dec 4, 2012 at 20:32
@Ian Hmmm, good question. I am by no means an expert, but I am extremely anal about checking to be sure that values are what I am expecting. This could be as easy as making sure the file name only contains whatever characters the OP accepts. But to be honest I do not know! — thatidiotguy
– thatidiotguy, Commented Dec 4, 2012 at 20:34
@thatidiotguy Oh of course, I agree that checking is always necessary. I guess there's always those possibilities. I know browsers only submit the filename to the server when you use a file element, so when you may see the full path to the file in the browser's element, the only thing that is submitted as the filename is the filename (everything after the last "/" or "\"). But that doesn't necessarily stop a rogue HTTP request from not doing that — Ian
– Ian, Commented Dec 4, 2012 at 20:37

Ian · Accepted Answer · 2012-12-05 15:10:31Z

1

Maybe use something like this:

<input type="file" name="mp3" onchange="this.form.submit();" />

Although I don't condone inline event handlers, it's just an example to make sure it works for you. The point is to catch the onchange event of the file input and then submit its form. Instead of using this.form or whatever, you can grab the form by ID (after giving it one) and call submit() on it.

UPDATE:

To keep your existing PHP code working, give your submit button an id attribute (something other than "submit") and try using this:

<input type="file" name="mp3" onchange="document.getElementById('submit_button_id').click();" />

Again, this could be more maintainable/readable if you made it a function call, like:

<input type="file" name="mp3" onchange="submitForm();" />
<input type="submit" name="submit" id="submit_button_id" value="Upload" />

<script type="text/javascript">
    function submitForm() {
        // However you need to submit the form

        document.getElementById("submit_button_id").click(); // Or whatever
    }
</script>

If you would rather change the PHP, you can use the original this.form.submit(); (or just use .submit() on the form element in whatever way). In the PHP, what you really care for is to check if $_FILES['mp3'] is set, so it's up to you if you need to check for the submit button's presence. I forget exactly how isset() works, so I don't want to assume and tell you something wrong. You might be able to use other logic, but the real thing you care about is if the file was sent in the submission, even though it might make it "better" if you make sure a button was used to submit it (though not necessary).

edited Dec 5, 2012 at 15:10

answered Dec 4, 2012 at 20:33

Ian

51k13 gold badges104 silver badges111 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user1478434 Over a year ago

thx, although it's submit but the upload not work, what i have to change in my php ? I try to change if(isset($_POST['submit'])) to if($_POST) but still my upload can't work.. Please help me

Community · Accepted Answer · 2017-05-23 10:24:45Z

1

Simple, attach a onchange() JS event to it.

<input type="file" name="mp3" onchange="call .submit() on a form"/><br />

This will submit the form when the user chooses a file. It's safer and more efficient to create these handlers in Jquery or a separate JS script. But for this example, it doesn't matter.

For more information, view this question: HTML <input type='file'> File Selection Event

edited May 23, 2017 at 10:24

CommunityBot

11 silver badge

answered Dec 4, 2012 at 20:36

Felix Guo

2,71818 silver badges21 bronze badges

Collectives™ on Stack Overflow

php upload auto submit after browse a file

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related