am trying to upload files and I discovered that ['tmp_name'] is empty if I select .mp4 file, .pdf and even flv. it works fine with image and doc files and other..
my html
<form id="MaterialUpload" action="#" method="post" enctype='multipart/form- data' class="form-horizontal form-row-seperated">
<input type="file" name="fileUpload" class="form-control" />
// javascript posting it via ajax
var formData = new FormData(this);
$.ajax({
url: '../CONTROLLER/MaterialAPI.php?CreateCategory=true=',
type: 'POST',
data: formData,
mimeType:"multipart/form-data",
contentType: false,
cache: false,
processData:false,
success: function(data, textStatus, jqXHR)
{
$(".auctncr").html(data);
},
// php
echo $_FILES['fileUpload']['tmp_name'];
In your php.ini change upload_max_filesize.
upload_max_filesize = 2M replace 2 with 6 or 10
Related
I am trying to upload mp3 file to server without using submit button i am using ajax but file not uploading to server.Where i am wrong here is my code
<script>
$(document).ready(function() {
$('#fileToUpload').change(function(){
var file_data = $('#fileToUpload').prop('files')[0];
var form_data = new FormData();
form_data.append('file', file_data);
$.ajax({
url: "modules/phone/newvoicemail.php",
type: "POST",
data: form_data,
contentType: false,
cache: false,
processData:false,
success: function(data){
console.log(data);
}
});
});
});
</script>
In newvoicemail.php i put following code
$src = $_FILES['file']['tmp_name'];
$file_name = $_FILES['fileToUpload']['name'];
$file_size =$_FILES['fileToUpload']['size'];
$file_tmp =$_FILES['fileToUpload']['tmp_name'];
$file_type=$_FILES['fileToUpload']['type'];
move_uploaded_file($file_tmp,"voicemail/".$file_name);
here is my html code
<form name="voicemailform" action="modules/phone/voicemail.php" method="POST" enctype="multipart/form-data" class="form-inline for-frm">
<input type="file" name="fileToUpload" id="fileToUpload">
</form>
Since you are uploading using ajax, you do not need name,action,
method and enctype attributes on your HTML form tag. Same applies to name attribute of file input tag.
You need to add enctype: 'multipart/form-data', to $.ajax({...});
Since you are appending form data with param name file in JS as
form_data.append('file', file_data);, you should access it in php
as $_FILES['file'] and not $_FILES['fileToUpload']
HTML Code:
<form class="form-inline for-frm">
<input type="file" id="fileToUpload">
</form>
JS Code:
$('#fileToUpload').change(function () {
var file_data = $('#fileToUpload').prop('files')[0];
var form_data = new FormData();
form_data.append('file', file_data);
$.ajax({
url: "modules/phone/newvoicemail.php",
type: "POST",
data: form_data,
contentType: false,
cache: false,
enctype: 'multipart/form-data',
processData: false,
success: function (data) {
console.log(data);
}
});
});
PHP Code: newvoicemail.php
<?php
$src = $_FILES['file']['tmp_name'];
$file_name = $_FILES['file']['name'];
move_uploaded_file($src, "./voicemail/".$file_name);
This question already has answers here:
How can I upload files asynchronously with jQuery?
(34 answers)
Closed 5 years ago.
I create jersey REST server and receive file upload.
This is the tutorial I follwed: https://gist.github.com/aitoroses/4f7a2b197b732a6a691d
Everything works fine when I try to test the server with Postman. I chose Body, form-data, key: file, value: my picture jpeg
What I try to do is to upload file using form html and jquery
Here is my form
<form>
<input id="imgFile" type="file" accept="image/*" value="Add file">
<input id="buttonPostReview" class="buttonSend" type="submit" value="Submit">
</form>
and here is my jquery
var postFile = function(e) {
e.preventDefault();
var imgFile = $('#imgFile').val();
var upLoalImgUrl = endPointUrl + 'webresources/photo';
console.log(imgFile);
console.log('uploading..');
$.ajax({
type: "POST",
url: upLoalImgUrl,
data: imgFile,
async: false,
cache: false,
contentType: false,
enctype: 'multipart/form-data',
processData: false,
success: function (returnData) {
console.log(returnData);
alert("Data Uploaded: ");
}
});
}
But I got error 415 - Unsupported Media Type
Can you show me how to upload file using jquery? I try to do some search but I can find the way to do this
$(...).val() doesn't get a file from a file input, it just returns the name of the file. You need to do $("#imgFile")[0].files[0] and send the file with FormData:
var data = new FormData();
data.append('file', $("#imgFile")[0].files[0]);
$.ajax({ data: data, ... });
I am not at all looking for anything fancy. i just want one image from a html file to be selected and on upload should go and sit in the server. I am just not able to make it. I have checked the forum questions and I built up the following code.
HTML Form:
<form id="fileinfo" enctype="multipart/form-data" method="post" name="fileinfo">
<label>Select File</label>
<input type="file" name="file" required="required" />
</form>
<input type="button" id="uploadBTN" value="Upload"/></form>
jQuery:
$(function () {
$('#uploadBTN').on('click', function () {
var formData = new FormData();
formData.append('image', $('input[type=file]')[0].files[0]);
$.ajax({
url: 'upload.aspx',
type: 'POST',
data: formData,
success: function (data) {
$('#output').html(data);
},
cache: false,
contentType: false,
processData: false
});
});
});
In the page_load of upload.aspx, i try to access Request.Files[0].InputStream i get
`System.ArgumentOutOfRangeException`.
Can someone suggest where am i going wrong?
I need to upload multiple files from a form. I have an event "submit" that processes the data of the form, uploads the files and then shows a message. I need that this process syncronous to show the message when the files have been uploaded.
I have this HTML code in the form:
<form method="post" action="files/upload_project_file" id="upload_project_file_form" target="upload_project_file_iframe" enctype="multipart/form-data">
<input type="file" name="uploaded_file[]" class="multi" maxlength="0" accept="" />
<input type="hidden" name="action" value="upload_project_file">
<input type="hidden" name="id_project_files" value="" id="id_project_files">
</form>
And this Javascript code in the javascript Submit event:
//processes data
//...
//Upload files
var data = new FormData();
jQuery.each($('input[name^="uploaded_file"]')[0].files, function(i, file) {
data.append('uploaded_file'+i, file);
});
data.append('id_project_files', $("#id_project_files").val());
$.ajax({
url: 'files/upload_project_file',
enctype: 'multipart/form-data',
data: data,
cache: false,
contentType: false,
processData: false,
async: false,
type: 'POST',
success: function(data){
//Clear
$('.filesToUpload').empty();
}
});
//Then show the message and redirect page
//...
I upload only one file but not all, I can't, I don't know why. I've seen Jquery.each runs only once.
No, thanks "user2698878", I didn't want to use Uploadify.
Finally I changed the ajax code and it works perfectly. This is the new code:
var formData1 = new FormData($("#upload_project_file_form")[0]);
$.ajax({
url: "files/upload_project_file",
enctype: 'multipart/form-data',
type: 'POST',
data: formData1,
async: false,
success: function (data) {
$('.filesToUpload').empty();
},
cache: false,
contentType: false,
processData: false
});
I have a form, with a file input, that submits just fine when I use the default action to submit the form. But, when I use JQuery and AJAX to make the call to the PHP file, it does not seem to get the file. Is there something that I need to add for sending files through JQUERY/AJAX?
My HTML:
<form id="photo-form" enctype="multipart/form-data" method="post" action="">
<input type="hidden" name="MAX_FILE_SIZE" value="5000000"/>
<input type="file" class="upload-input" name="upload-new-input" autocomplete="off"/>
<input type="submit" name="submit" value="submit/>
</form>
My JQuery:
$(document).ready(function() {
$("#photo-form").submit(function(e) {
e.preventDefault();
var dataString = $(this).serialize();
$.ajax({
type: "POST",
url: "uploadcover.php",
data: dataString,
async: false,
success: function(data) {
alert(data);
}
});
});
});
You can use FormData to upload file with data
Here is sample code
JQuery
$("#photo-form").submit(function(e) {
e.preventDefault();
var formData = new FormData($(this)[0]);
$.ajax({
type: "POST",
url: "uploadcover.php",
data: formData,
async: false,
cache: false,
contentType: false,
processData: false,
success: function(data) {
alert(data);
}
});
return false;
})
You can get it on PHP
PHP CODE
$Img = $_FILES['upload-new-input'];
You can see tutorial Uploading files with jquery ajax
Hope It helps you :)
You cannot access file directly.
You can use a plugin, to do this for you, i.e. https://github.com/blueimp/jQuery-File-Upload
Also, in html5 it is possible to access a file from file input as a blob. You can than send it using formData.
More info here: https://developer.mozilla.org/en-US/docs/Web/Guide/Using_FormData_Objects