jQuery $.POST ส่งค่า FILES อย่างไร Html Javascript PHP FileUpload Mysql
โดยปกติแล้ว เวลาที่จะส่งค่า ผ่าน Submit ผมจะไม่ใช้ submit ตรง ๆ ผมจะส่งผ่าน $.post หรือ $.get ประมาณนี้Code (JavaScript)
$.post('Products/Products/img_upload', function(o){
console.log(o);
},'json');
Code (JavaScript)
$.post('Products/Products/img_upload', {id:1, name:'A'}, function(o){
console.log(o);
},'json');
Code (PHP) <input type="file" id="file-upload" class="file file-name" accept="image/*;capture=camera" name="fileupload">
Code (JavaScript)
$('#file-upload').change(function(){
var file_name = document.forms['products'].fileupload.value;
if(file_name){
$.post('Products/Products/img_upload', {fileupload:file_name}, function(o){
console.log(o);
},'json');
}
});
Code (PHP) function img_upload(){
$valid_extensions = array('jpeg', 'jpg', 'png', 'gif', 'bmp'); // valid extensions
$path = 'public/images/products/'; // upload directory
echo $_POST['fileupload'];
echo $_FILE['fileupload'];
echo $_FILES['fileupload'];
}
Code C:\fakepath\13434719_1304116089613580_7349152507558105682_n.jpg
Notice: Undefined variable: _FILE in ....on line 40
Notice: Undefined index: fileupload in ....on line 41
Tag PHP, MySQL, HTML/CSS, JavaScript
Date :
2016-10-10 13:48:51By :
INTzView :
4123Reply :
2
ทำได้แล้วครับ ไม่ Reload หลังจากที่ใช้ function move_uploaded_file เพราะผมต้องการ return id ออกมา Stamp ให้กับ Field ใน Form อีกครั้ง เพื่อ Submit อีกรอบCode (JavaScript)
$('#fileupload').change(function(){
var name = this.files[0].name;
var formData = new FormData($('#products')[0]);
if(name){
$.ajax({
url: "Products/Products/img_upload",
type: "POST",
data: formData,
contentType: false,
cache: false,
processData:false,
beforeSend : function(){
//$("#preview").fadeOut();
$("#products-img-result").fadeOut();
},
success: function(data){
console.log(data);
},
error: function(e) {
$("#products-img-result").html(e).fadeIn();
}
}, 'json');
}
});
Code (PHP) function img_upload(){
$valid_extensions = array('jpeg', 'jpg', 'png', 'gif', 'bmp'); // valid extensions
$path = 'public/images/products/'; // upload directory
if(isset($_FILES['fileupload'])){
$img = $_FILES['fileupload']['name'];
$tmp = $_FILES['fileupload']['tmp_name'];
// get uploaded file's extension
$ext = strtolower(pathinfo($img, PATHINFO_EXTENSION));
// can upload same image using rand function
$final_image = rand(1000,1000000).$img;
// check's valid format
if(in_array($ext, $valid_extensions)){
$path = $path.strtolower($final_image);
if(move_uploaded_file($tmp,$path)){
echo "<img src='$path' />";
}
}
else {
echo 'invalid file';
}
}
}
Date :
2016-10-10 15:35:05By :
INTz
ใช้ตัวนี้ครับ jQuery form
Date :
2016-10-10 15:48:27By :
Krungsri
Server 05
Load balance : Server 05
