0

I have a form with two file upload fields. When you handle files uploaded through HTML with PHP normally, you get a $_FILES array with a bunch of entries like $_FILES['name'], $_FILES['tmp_name'], etc. that contain all the file information.

I'd like to be able to get all of that information with jQuery. Simply doing $('[name="textfile1"]').val() just gives me C:/fakepath/test.txt if I upload test.txt. Is there a way to get the actual array of information? I have a bunch of text input fields along with the file upload fields and I want to be able to pass all the information at once with an AJAX call.

    <form action="" method="post" enctype="multipart/form-data">
        <div class="input">
            <p>Upload the sitelist (.txt files only):</p>
            <input style="margin-top:0;margin-bottom:6px" type="file" name="textfile1" /><br />         
        </div>

        <div class="input">
            <p>Upload the dictionary (.txt files only):</p>
            <input style="margin-top:0;margin-bottom:6px" type="file" name="textfile2" /><br />         
        </div>
    </form>
Improve this question
1

1 Answer 1

Reset to default
1

I hate to rain on your parade, but that is not possible.

PHP processes things server-side. The information generated when you submit the form (such as file size, file type, file tmp paths, etc.) is all generated on form submit. If this was possible, form validation would be much easier, as it could check during the insertion of the file. However, that would be a security risk too, as it would expose the current username (by the file paths containing usernames).

You mentioned that you wanted to push it via ajax. Files can't be sent asynchronously. This can be done by simply submitting the form via ajax. However, you won't be able to get the file information without first going through PHP & generating the variables server-side.

If you simply want the file name & other generic information (not the paths that PHP generates), take a look at the HTML5 File APIs at HTML5Rocks' Tutorial for File APIs here.

I hope I helped you. ;)

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

6 Comments

You can actually read files using HTML5's File API and blob, as long as it has been chosen in the form.
@BenFortune Yes, I realize that, however, you can't read the temporary location that PHP generates like he wanted to above.
He won't need the temporary location if he can read the text file from the browser and pass the data to AJAX. Though it's not nearly as much as PHP can do.
@NetworkNerd: Thanks, I'll look into the HTML5 File APIs. Ben's right - I don't care about the temp location (I just used that as an example); all I want is to grab the file data without having to refresh the page.
@BenFortune Once again, yes, I do realize that. However, reading the file inline & without any refreshing can be a HUGE security breach, if the web developer decides to immediately save the file contents server-side via a POST ajax to PHP. PHP can get the critical & vitals of files. Javascript wasn't meant to save files. In addition, you can't read the file unless an open stream is processed, which uploading does. Where are you going to store the temporary file? OFC, HTML5 local app storage is an option. Nonetheless, there is many things JS should & shouldn't be handling. Use with caution.
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.