On a web page I'm developing I have a file input field that allows the user to upload an image. However is it possible to instead of the input field, have an icon that when clicked launches the window for the user to attach a file. Then once the users has attached an image it stores the path to that image in a hidden input somewhere?

 

Thanks for any help.

Try to use a jquery script called Uploadify. Also, do some Google research using keywords like "jquery input file" etc. You'll find few more or less know scripts.

 

You could also use CSS to hide a input button using opacity. It might be sufficient solution, depends on Your needs.

I believe you have to use the <input type="file"> method for uploading files. You can then use the css "background" property to add the image to the input field.

 

As for getting the uploaded file name just use the global array ' $_FILES["NameOfFileInputField"]["name"] '

 

So if you had something like this:

 

<form action="" method="post">
<input type="file" name="Samus" />
<input type="submit" name="submit" value="Submit" />
</form>

 

And then on the page you're POSTing the data to, get the name of the uploaded file like this:

 

echo "Uploaded file name is:" . $_FILES["Samus"]["name"];

 

Just a basic idea.