The following two questions clarify that the value of input file cannot be changed due to security reasons.
- changing value of <input type=file">
- How to show file path in <input type="file" />?
In PHP, when validating a form, one of the usual approaches is to re-fill the entered value in input text that was provided before clicking the submit button, so that the client knows what he inserted, or simply to keep the values in the fields, which is what the client is expecting. (He won't have to re-fill the form every time when there's a specific error).
So we use the following:
<input type="text" name="title" id="title" maxlength="100" value="<?php echo htmlspecialchars($title);?>" />
So since I cannot change the value of the input file, so I can re-fill it with the provided path $image['tmp_name'], this means the client will have to re-upload (or re-browse) the image each time a validation goes wrong, isn't there any possible way to keep that value?
You could store the file regardless of other validation errors in the form (obviously only if the file itself is valid), and then replace the file upload field with the file details (e.g. list the filename and size).
Actually rather than replacing the field, I'd recommend giving them the option to upload a different file in its place if they wish.
Store the uploaded file on the server.
Generate a checkbox with a value that references an id associated with that file. Make it checked by default.
Tell the user to uncheck it if they don't want to reuse the same file.
Using javascript you can prevent the form from being submitted until all fields are validated.
I recommend jQuery Validation Engine tutorial included. demos
Also you can add some style to the image uploader using jQuery file upload.
Of course some field must be verified on the server that's why you can post an ajax request with the validation engine.
"ajaxUserCall": {
"url": "ajaxValidateFieldUser",
"extraData": "name=eric",
"alertText": "* This user is already taken",
"alertTextOk": " * User is valid",
"alertTextLoad": "* Validating, please wait"
},
Some example with server side validation witout redirection or refreshing : Demo
