I have a html form with some text input and a file input (image logo).
Now, if there is an error with one of the text inputs (like length is invalid) when the user click the submit button [client->server(php)->client], the content of the file input is cleared which is annoying!
I set others text input with last values when the page submits with an error, but I cant with a file input. I tried to set the file input value with document.getElementsByName('logo')[0].value; to set it in a hidden value but I got the path "C:\fakepath\random-0690.JPG"... this is so shocking, I know its for security purposes but it is shocking...
How i can resolve that? Thanks.
It's not possible. You cannot remotely set the value of a file input as a basic security measure. If you could, then it'd be trivial to do <input type="file" value="/etc/passwd" name="pwn3d" /> and steal any file you want from the user's machine.
There's nothing shocking about it at all. Live with it, or enjoy having your files stolen.
I found the answer !
This is simple, I created an AJAX call that send the form contents and validate if everything is okay. Then if there are errors, display these (and it will keep the values and file attachments in the form) .. Else : Send the post form and the attached file.
Related
Okay so here's the scenario:
User is presented with form that contains file inputs.
User submits form.
Form does not pass validation/verification for one reason or another.
User is presented form with errors highlighted.
File inputs are now blank.
Question:
Is it possible to re-populate the file inputs with the paths to the files the user originally selected. A PHP solution would be ideal, but I'm also open to JavaScript solutions as well.
I think the short answer here is no. You can't repopulate file upload fields. However, you can work around it.
If a file has been selected and the form submitted, then you've already received the file. What you can do is keep a reference to the file on disk and put that in a hidden field and show a message to indicate to the user you still have their file uploaded so it does not need to be replaced/re-uploaded. When your form gets submitted again without a file, you can check for the hidden field value and use that to get your local copy of the file they uploaded in their last attempt.
The other way to do this is to either submit the form via ajax (using either flash or the iframe method for the file upload) or to do an ajax call to validate the form first, and then only submit as normal if valid (thus no form reload, no loss of file upload field data).
I solved this problem by let user pick upload file as the last field before submit the form ^^
I have followed tutorial: http://symfony.com/doc/current/cookbook/doctrine/file_uploads.html
but I have problem handling situation when I upload file, but other field does not meet validation criteria and user is directed to fix form errors. Then when user fix problem and hit submit button, he no longer has valid image in form and missing file error is displayed.
I have prepared small example project to illustrate this behavior:
https://github.com/Jaslanin/sf_upload_form_error
Steps to reproduce this behavior:
open web/ dir of project inside browser
in name field put string "123"
set image file for file field
hit submit button
change name field to "123456"
hit submit button
observe that form has missing file error
For now I handled this problem using steps within "How to Handle File Uploads with Doctrine" tutorial, but without using lifecyclecallbacks. I run ->upload manually and in case of error store file path inside session.
It works, but I am looking for cleaner solution for that problem.
When you render the form on your page all input fields are populated with values from an entity or an array. The key point here is that you have no data to pre-populate file input field. So it renders as empty input. And when user hits submit on step 6, there is no file selected/uploaded. Your solution with a session-stored uploaded file path is proper solution in this case.
I also suggest you to show to user, that some file has been already submitted when there is one in the session.
I'm Just working on a simple form in PHP but i have a problem, i have many fields in my form and one of these is a file input type, if there are no issues with the file uploaded but an error occurred on another field, How can I ( in the refreshed page) maintain the file previously uploaded?
Edit: We understood what you want, but this is not possible, filling the file-input again automatically after validation. The user has to select his files again, this is how browsers works, for security matters.
Well, since you know what you're doing, you dont really need a script, you really need some help/ideas on how to approach what you want. What I would do is:
- Save the path of the uploaded file in session user data variable, like $_SESSION['uploaded_file'], and retrieve it after error.
- Use AJAX, different form, to upload the file before user hit submit.
Obs: If the user gives up on completing the form even though he uploaded a file, his files will be on your server, 'stealing' some useful space. So I don't know if this is a really good approach, but a good one, would be using different forms, disassembling the upload action from the form's informations.
Real example: If user is filling out a form to be a member of your website/forum/whatever, just let him upload the profile picture later, only when his account is really active. You could be saving some trouble.
Another one: If the user just wants to change profile picture, also make the uploading action to have no influence (and vice-versa) with his profile informations and etc. This is a trouble-saver, and a better approaching solution.
But, if you're like uploading a photo to a gallery and setting description and etc for the picture, then you could be using of a more elaborated validation, using javascript/ajax to check if fields are being filled correctly before submiting data.
On your upload code first save the values into SESSION like:
$_SESSION[name] = $_POST[name];
then print it into your INPUTS like:
<input type="text" name="name" value="<?=$_SESSION[name]?>">
Don't forget to use session_start().
Or look for javascript alternatives
I am building a form right now that returns the user back to the form itself if there is missing fields or fields are entered wrong. One of the inputs is a image file. I was wondering if you want to echo out the image location again, do you use $_FILES[tmp_name]?
e.g. value="$_FILES[tmp_name]" to echo back the location so the user doesn't have to reselect the image again.
its not possible this way.
the $_FILES[tmp_name] reflects the full path of the already uploaded image on the server.
an its not possible to pre-select the upload field in the browser and its also not possible to get the full client-side path of the uploaded file.
so in case of an error, you could copy this temporary file to another location and display the already uploaded image to the user instead of giving him the upload field again.
but you need to make sure to delete this copied image if the user didn't try to fix his invalid fields.
or you seperate the validation of the fields from the image upload part. using some ajax magic or seperate form.
No, you can't use $_FILES['tmp_name'] in this way, as that isn't the name it had on the users computer, but the temporary name that it has on your server in your tmp folder. Not sure if there is a way to do this. I'll look into it and let you know if I find anything, but I doubt there is.
If you used an AJAX file upload, you wouldn't have to worry about this though.
This is not possible, you could try to use a value attribute on a file input to see that it has no effect.
Imagine that if you could do this it would be a serious security problem (ie: hide a file input with a pre-filled value with a common path for an important file and get it the same time with some other details)
If the form is submitted via normal html form submission then you do not have access to the user's file path. Your best bet is to use an AJAX form submission.
My client wants to have a 3 page form. The first page allows the user to enter data including a uploaded file. the second page confirms this data. and the third page submits the data to the database and directories.
Via post, I can keep saving the data to a hidden input fields, thats no problem. My problem is the uploaded file. how do I hold that document from page to page ? I am using Cakephp but any advice would help, thanks
You can always just create the illustion that the form is utilising three different pages. Use AJAX to accept and validate/request the user confirm their submitted data. If in this view they accept it initiate a POST to submit all that data.
You really don't need three physically different files to achieve this but you can still let it appear in three stages to keep your client happy.
You just upload the file to temp directory and keep the value in hidden variables just like other form data . If form successfully submitted then the image copy to desired location other wise delete the image
You can easily fake these 3 pages using CSS. Or even 2, as "third page" is actually a server script which has nothing to do with pages in the browser.
Just make your form, then put an event on the submit button which changes divs to whatever "confirmation page" he wants. and then actually send the form using a button on this page.
that's all
An uploaded file is always held temporarily. The server env var should tell you where it is. In Ruby's rack it is stored in the params var. So I guess there is a similar params var in php which has a hash with all the necessary information.
Since the file would be uploaded on the first step, one option is to put the file's location in a hidden input field along with the rest of the data (either there, or put it in the session). With CakePHP, if your file field looks somewhat like that:
<input type="file" name="data[User][image]" id="UserImage" />
Then you will be able to capture the location through
$location = $this->data['User']['image']['tmp_name'];
Which will correspond to something like /var/tmp/xxxxxx
On the last page, if the user confirms all the data, you just use move_uploaded_file() to put the file wherever you want on the server.
move_uploaded_file($location, '/new/location');