I'm struggling on letting the user upload and image to an image field on the HTML doc. When i test it, i can select which image to upload and then click "UPLOAD" but it doesn't go anywhere or go to the field i want to designate it to.
<input name="imgfield" type="image" width="100" height="100">
<form action="" method="post" enctype="multipart/form-data" name="form1" id="form1">
<p>
<label for="file">Select Picture</label>
<input type="file" name="file" id="file" />
<input type="submit" name="btn_uploadpic" id="btn_uploadpic" value="UPLOAD"
<?php
if (isset($_POST['btn_uplaodpic']))
{
$id=$_POST['imgfield'];
}
?>/>
</p>
</form>
When uploading a file, you won't get the uploaded file in $_POST, but in $_FILES. Check here for a quite detailed example on how to upload files with PHP:
http://www.w3schools.com/php/php_file_upload.asp
You have to refer to a temporary filename, using files, you can do something like
$_FILES['imgfield']['tmp_name']; // temp_name can be anything
If referring to 'name' isn't enough then give the input an 'id' of value 'imgfield'
Related
My question is straightforward, i want my Form to be just an input button to browse for the file and do the work too instead of two inputs like in the image bellow :
here is my code :
**EDIT : ** all I want is ONE BUTTON not two like in the picture , one button to do the work preferably called "upload image"
in the image bellow the form consists of two buttons one does the choosing and another one does the submitting of the form action.
<form class='formUpload' action="uploadImage.php" method="POST" enctype="multipart/form-data">
<input value="Upload Image" class="ToUpload" name="fileToUpload" type="file" />
<input type="submit" name="fileToUpload" value="Upload Image">
</form>
ok let me add an example asumming you are expecting the same here is something that you might be looking:
HTML:
<form method="post" action="abc.php" name="imageform" id="imageform">
Choose File :<input type="file" name="file" id='fileupload'>
</form>
js:
$(document).ready(function(){
$('#fileupload').on('change',function(){
$('#imageform').submit();
});
});
I have a Form with some fields:
<form action="xyz.php" method="post" enctype="multipart/form-data">
<input type="text" placeholder="First name" name="firstname">
...
<input type="file" name="logo">
...
<input type="submit" name="submit">
</form>
The image should be uploaded immediately to img_upload.php. In this file i need the $_FILES array.
My img_upload.php script uploads the image, do some things with the image (resize, ...) and give me the URL to the image. After this, the image should be displayed in the form.
Is there any chance to upload the image (send $_FILES array to another file) without submiting the whole form?
<input type="file" name="logo" onchange="uploadThisFile(this)" >
function uploadThisFile(file) {
/* launch an ajax request to img_upload.php and pass file details via POST */
}
HTML code is below
Upload Your pic only in jpg (Less 1 MB)
<input type="file" title="Upload Your pic in jpg (Less 1 MB)" accept="image/jpeg" required="" class="select-style" tabindex="1" name="file[]" multiple />
PHP code is below:
echo $_POST[$_FILES['file[]']];
echo $_POST[$_FILES["file"]["size"]];
Your fomr must contain
enctype="multipart/form-data"
Like :-
<form name="upload" id="upload" method="post" action="" enctype="multipart/form-data">
You can use $_FILES['file']['size'][0]; to get size of uploaded file
Hope this will help you
Thanks
Ok..
here is my HTML Page page name stack.html
<form name="upload" id="upload" method="post" action="stack.php" enctype="multipart/form-data">
<input type="file" title="Upload Your pic in jpg (Less 1 MB)" accept="image/jpeg" required="" class="select-style" tabindex="1" name="file[]" multiple />
<input type="submit" value="submit">
</form>
and here my PHP page page name stack.php
<?php
if(!empty($_FILES)){
echo "<pre>";
print_r($_FILES);
echo "</pre>";
exit;
}
?>
See if it gives any luck. Try it in php file..
foreach($_FILES as $file){
print_r($file['size']);
print_r($file['name']);
//if you want total size of all images
echo array_sum($file['size']);
//if you want individual name
for($i=0;$i<count($file['name']);$i++){
echo $file['name'][$i];
echo $file['size'][$i];
}
}
I was wondering whether it is possible to rename an image base on the form input file ID.
<form action="upload_file.php" enctype="multipart/form-data" method="post">
<input id="picture_01" type="file">
<input id="picture_02" type="file">
<input id="picture_03" type="file">
<input id="picture_04" type="file">
<input name="submit" type="submit" value="Submit">
</form>
I want that if the image is uploaded from input 4 it will be renamed to 'picture_04', if it is from input form 2 it will be renamed to 'picture_02'. Not sequencially but according to the input form box.
I haven't managed to do this despite the various trial and errors.
I would use separate forms for each input. This way you could use a hidden input like:
<form action="upload_file.php" enctype="multipart/form-data" method="post">
<input type='hidden' name='picture_03_file' value="picture_03" />
<input type='file' name='picture_03_name' />
</form>
<form action="upload_file.php" enctype="multipart/form-data" method="post">
<input type='hidden' name='picture_04_file' />
<input type='file' name='picture_04_name' value="picture_04" />
</form>
This way your PHP code would look like:
$imgName = $_POST['picture_04_name'];
// Do file upload here
You need to name your inputs:
<input id="picture_01" name="picture_01" type="file">
etc.
Then in PHP you retrieve the image with the $_FILES array, like $_FILES['picture_01'] or by simply looping through $_FILES.
foreach( $_FILES as $input_name=>$file)
{
// $input_name is the name used as the form input name
// $file is an array with the following keys: name, type, tmp_name, error, size.
}
Of course the manual is always a good read http://www.php.net/manual/en/features.file-upload.post-method.php
I have a form which I am using to upload users photos but the problem is that I can upload 1 photos each time .like facebook I want my users to select multiple images in one shot. can anyone please guide. here is my present code.
<tr><td><input type="file" name="photos[]" /></td><td><input type="text" size="35" name="descriptions[]" /></td></tr>
and php is processing the uploaded images. can you please tell how should I do so that multiple images can be selected and uploaded in one shot
first thing is you need to make your form multipart
<form method="post" action="where_ever" enctype="multipart/form-data">
And if you use HTML5 the next part is to create a named array
<input type="file" accept='image/*' name="multiImageUpload[]" id="multiImageUpload" />
<input type="file" accept='image/*' name="multiImageUpload[]" id="multiImageUpload" />
<input type="file" accept='image/*' name="multiImageUpload[]" id="multiImageUpload" />
This will put all files into a $_POST array called multiImageUpload.
In order to allow a name to accept multiples in an array you need to use []
at the back of name, name[] or images[] or files[], also using the HTML5
property multiple multiple='' or multiple='multiple' will allow you
to select multiple files at once form a single input.
Here's some working sample code to play around with
The HTML
<form method="post" action="upload.php" enctype="multipart/form-data">
<input name='uploads[]' type="file" multiple=""/>
<input type="submit" value="Send">
</form>
The PHP
foreach ($_FILES['uploads']['name'] as $filename) {
echo '<li>' . $filename . '</li>';
}
// full contents of $_FILS
echo '<pre>';
var_export($_FILES);
echo '</pre>';