How can I send an uploaded image from one form to a second form on submit? The code for the first form:
<form class="usp-form" method="post" enctype="multipart/form-data" action="http://www.aeroe.com/gate/" data-validate="parsley" data-persist="garlic" novalidate>
<input name="usp-files" type="file" maxlength="255" data-required="false" placeholder="File(s)" class="usp-input usp-input-files select-file multiple" multiple="multiple" id="usp-multiple-files" />
<input type="submit" value="Go To Step 2">
</form>
Code for the second form. I need the file input on this second form to have the files from the previous form in it, which I will then submit at a later stage.
<form class="usp-form" method="post" enctype="multipart/form-data" action=" http://www.aeroe.com/submit/" data-validate="parsley" data-persist="garlic" novalidate>
<input name="usp-files[]" type="file" maxlength="255" data-required="false" placeholder="File(s)" class="usp-input usp-input-files select-file multiple" multiple="multiple" id="usp-multiple-files" />
<input name="usp-file-limit" class="usp-file-limit" value="20" type="hidden" />
<input name="usp-file-count" class="usp-file-count" value="1" type="hidden" />
<div class="usp-preview"></div>
<input type="submit" value="Go To Step 2">
</form>
An unsuccessful solution I thought to include: Its been suggested that I use the following code in between my second form tags:
foreach ($_FILES["usp-files"] as $file) {
echo '<input name="usp-files[]" value="'.$file["usp-files"]["tmp_name"].'" type="hidden" />';
}
along with this code to put in to the index file of http://www.aeroe.com/submit/ (I don't know where to find the index file):
foreach ($_POST["usp_files"] as $file) {
//get the location of the file
$fileslocation= tempnam(sys_get_temp_dir(), $file);
//move the file to somewhere else
move_uploaded_file($file, $destination);
}
Related
I have a webpage where a user can submit one or several images. I have designed this as a two-step solution, where step1.php contains file uploads and a checkbox:
<form method="post" action="step2.php" enctype="multipart/form-data" name="upload_form">
<div class="form-group">
<label for="InputFile">Choose images:</label>
<input type="file" name="userfile[]" id="file" size="50"><br/>
<input type="file" name="userfile[]" id="file" size="50"><br/>
</div>
<div class="checkbox">
<label><input type="checkbox" name="CheckThis" value="CheckThis">
I have checked this box
</label>
</div>
<input type="hidden" name="id" value="<?php echo $_REQUEST['uid']; ?>">
<button type="submit" class="btn btn-default">Send inn</button>
</form>
Then, in step2.php, I handle the uploaded files, make thumbnails, and asks the user to give the images a title and a comment.
Now, I want to make this more user-friendly and a bit more web 2.0 :-)
My step1.php is now using Dropzone:
<form method="post" action="step2.php" enctype="multipart/form-data" name="upload_form">
<div class="form-check">
<input class="form-check-input" type="checkbox" value="CheckThis" name="CheckThis" id="defaultCheck1">
<label class="form-check-label" for="defaultCheck1">
I have checked this box
</label>
</div>
<input type="hidden" name="id" value="<?php echo $_REQUEST['uid']; ?>">
<div class="dropzone dropzone-previews" id="my-awesome-dropzone"></div>
<button type="submit" class="btn btn-primary" id="submit-all" value="Submit">Submit all</button>
</form>
And my JS:
Dropzone.autoDiscover = false;
var myDropzone = new Dropzone("div#my-awesome-dropzone", { url: "upload.php"});
myDropzone.on("sending", function(file, xhr, formData) {
// Will sendthe filesize along with the file as POST data.
formData.append("filesize", file.size);
formData.append("foo", "bar");
});
upload.php is using the example-code from https://www.startutorial.com/articles/view/how-to-build-a-file-upload-form-using-dropzonejs-and-php
Uploading works, when a user selects/drops multiple files in Dropzone, the are uploaded to the server. However, I do not know how I can direct the user to step2.php where the user can see the images and give them a title or comment. I have tried to append formData as you can see, but those data are submitted to upload.php, not step2.php.
Update:
To clarify my problem: If step2.php just contains:
<?php
phpinfo(INFO_VARIABLES);
?>
I do not see any references to the files I uploaded, nor the variables filesize and foo which I declared in the JS.
How can I transfer data from Dropzone and upload.php to step2.php?
Or, am I doing this old-fashioned? Should I do this in a completely other way? Can I get the users to submit a title and comment on the step1.php-page, and submit/upload all when done? How do a redirect them to a landing-page when done?
function assignFile(obj){
var file2 = document.querySelector('#fileData');
file2.files = obj.files;
console.log(file2.files);
}
<form action="" method="post" enctype="multipart/form-data">
<input type="file" name="fileData[]" id="fileData" multiple="" style="display: none;" />
File: <input type="file" id="file" name="file" onchange="assignFile(this)" />
<input type="submit" name="submit" value="Submit" />
</form>
I have two file fields. I want to assign file data to fileData field.
I have posted my code. This code working fine in chrome. But not working in mozilla. Could you please check.
I have made a form in my site, which will allow me to get suggestions about Rubik's cube algorithms, but how to know what input the user has? For better understanding, I've given the code below:
<form method="POST">
<label>Your name: </label><br>
<input type="text" name="name" placeholder="Your Name" required><br><br>
<label>Your E-mail: </label><br>
<input type="email" name="email" placeholder="email#domain.com" required><br><br>
<label>Select puzzle: </label><br>
<input type="radio" name="2x2" value="2x2">2x2<br>
<input type="radio" name="3x3" value="3x3">3x3<br><br>
<label>Select set/subset: </label><br>
<input list="set"><br><br>
<datalist id="set">
<option>Ortega OLL</option>
<option>Ortega PBLL</option>
<option>CLL</option>
<option>EG-1</option>
<option>EG-2</option>
<option>F2L</option>
<option>OLL</option>
<option>PLL</option>
<option>COLL</option>
<option>WV</option>
</datalist>
<label>Your Alg: </label><br>
<input type="text" name="alg"><br><br>
<input type="submit" name="submit" class="w3-black w3-button w3-hover-white w3-hover-text-blue w3-text-white">
</form>
Please add action attribute to your form tag and on submit here is the example
<form action="getvalue.php" method="post">
</form>
Note: Every form element must have unique name .
after adding action attribute then create getvalue.php file and add following code in to it
<?php
print_r($_POST);
?>
Above code will give all the form field values
do let me know if it was helpfull...
I'm not sure exactly what you want to do, but here is an example of a form that submits to itself. This will allow you to remain on the same page after the form has been submitted. You can change what the user sees to indicate that the form was done successfully/etc. I have tested this code and it works.
<main>
<?php
// When the form is submitted
if (isset($_POST["submitButton"])){
//Do something with the data from the form - you don't have to print it out.
//This is all done on the server.
//Connect to DATABASE, send an EMAIL, VALIDATE the form, etc.
print("<pre>");
print_r($_POST); // for all GET variables
print("</pre>")
?>
<!-- This HTML will be visible to the user after the form has been submitted. -->
<h1>The form has been submitted successfully!</h1>
<?php
}else{ //If the form has not been submitted
?>
<form method = "post" >
First name:<br>
<input type="text" name="firstname" value="Mickey">
<br>
Last name:<br>
<input type="text" name="lastname" value="Mouse">
<br><br>
<input type="submit" id = "submitButton" name = "submitButton" value="Submit">
</form>
<?php
} //End else
?>
</main>
I have a form that is need to be passed to my CRM.
the form is simple and contains 2 important fields that defines under what category the data will be received in my crm.
<form method="post" action="http://api.leadmanager.co.il/v1/submit" id="lm_form">
<input type="hidden" name="lm_form" value="5750" />
<input type="hidden" name="lm_key" value="cc0ce4fe280e46e986e5716f9feedaab" />
<input type="hidden" name="lm_tyt" value="" />
<input type="submit" value="submit"/>
</form>
I want to add a drop down list with 2 options first will send the form i mentiond above as is.
the second will modify the values of "lm_key" and "lm_form" to other values.
Plain JS code can be like this. But I would advice you to use some JS library like JQuery, AngulerJS or another one.
<form method="post" action="http://api.leadmanager.co.il/v1/submit" id="lm_form" name="form">
<input type="hidden" name="lm_form" value="5750" />
<input type="hidden" name="lm_key" value="cc0ce4fe280e46e986e5716f9feedaab" />
<input type="hidden" name="lm_tyt" value="" />
<select name="selectField" onchange="changeValues()">
<option value="1">1</value>
<option value="2">2</value>
</select>
<input type="submit" value="submit"/>
</form>
<script>
function changeValues() {
form.lm_key.value = form.selectField.value;
form.lm_form.value = form.selectField.value;
}
</script>
I have a little problem and i cant solve it. Below is my form. The question is: how can i put image which was put in input where is ajaximage.php to another form to a hidden input. I want the image was firstly send by ajaximage.php and shown and keept by another form and send to upload.php
<div class="kontakt">
<input type="checkbox" name="check" value="1" onclick="document.getElementById('imgfile').style.display = this.checked ? 'block' : 'none';
this.elements['photoimg'].disabled = this.form.elements['nazwa3'].disabled = !this.checked" />
<form id="imageform" name="nazwa2" disabled="disabled"style="display: none" method="post" enctype="multipart/form-data" action='ajaximage.php'>
<input id="imgfile" style="display: none" type="file" name="photoimg" id="photoimg" />
<div id='preview'></div>
</form>
<form id="dodaj" method="POST" enctype="multipart/form-data" action="upload.php">
<input type="hidden" name="ok" value="1">
<input type="hidden" name="MAX_FILE_SIZE" value="665600">
<input type="file" style="margin-bottom:30px; margin-top:20px;" name="plik" size="40" />
<textarea rows="4" cols="50" style="margin-bottom:30px;" placeholder="Wpisz swój tekst." required name="tekst" wrap="virtual">
<?php
if(isset($_SESSION['tekst']))
{
$tekst = $_SESSION['tekst'];
echo $tekst;
}
?>
</textarea>
<input type="submit" value="Dodaj" />
</form>
</div>
You can't add a file from one <input type="file"> to another <input type="file">.
This is because you can't set a file inputs value due to security reasons.
You cannot pass uploaded files directly to another form. You need to move it into a temporary location and give it a unique filename which you can then store into a hidden field in the second form. When you submit the second form then you receive the hidden value and you are then able to access the previously uploaded file.
See this: http://php.net/manual/en/function.move-uploaded-file.php