i'm a newbie and i want to ask my project, i'm created a file to upload image and save to database MySql, where its file will be divided into 3 file
File HTML, this is my code :
<form class="form-horizontal" id="inputForm" enctype="multipart/form-data"><input type="hidden" id="id">
<div class="form-group">
<label for="name" class="col-sm-2 control-label">Video Name</label>
<div class="col-sm-6">
<input type="text" class="form-control" id="name" placeholder="Video Name">
</div>
</div>
<div class="form-group">
<label for="nama" class="col-sm-2 control-label">Video URL</label>
<div class="col-sm-6">
<input type="text" class="form-control" id="url" placeholder="https://www.youtube.com/watch?v=ki_dQd8hJP4">
</div>
</div>
<div class="form-group">
<label for="date" class="col-sm-2 control-label">Date Created</label>
<div class="col-sm-3">
<input type="date" class="form-control" id="date">
</div>
</div>
<div class="form-group">
<label for="nama" class="col-sm-2 control-label">Image</label>
<div class="col-sm-3">
<input type="file" id="image" class="form-control">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="button" class="btn btn-primary glyphicon glyphicon-save" id="btnSave">Save</button>
<button type="button" class="btn btn-danger glyphicon glyphicon-remove" id="btnReset">Reset</button>
</div>
</div>
</form>
$(document).ready(function(){
Modul.find("button#btnSave").click(function(){
var name_gr=Modul.find('input#name').val();
var url_gr=Modul.find('input#url').val();
var date_gr=Modul.find('input#date').val();
var image_gr=Modul.find('input#image').val();
var id_gr=Modul.find('input#id').val();
$.ajax({
type :"POST",
dataType : 'json',
url :"page/video/process_video.php",
data :{action:'commit', name:name_gr ,url:url_gr, date:date_gr , image:image_gr ,id:id_gr},
success:function(json){
alert(json);
},
complete:function(){
selectVideo();
Modul.find("div#list").fadeIn();
Modul.find("div#form").hide();
}
});
}); });
<?php error_reporting(0); include "../../config/conn.php"; <br> $ACTION=$_POST['action'];
switch($ACTION){
case "commit":
$ID=$_POST['id'];
$NAME=$_POST['name'];
$URL=$_POST['url'];
$DATE=$_POST['date'];
$IMAGE=$_POST['image'];
if($ID==""){
$query="insert into tb_video (videoname, urlembed, datecreated, gambar) values('$NAME','$URL', '$DATE', '$IMAGE')";
}else{
$query="update tb_video set videoname='$NAME',urlembed='$URL',datecreated='$DATE', gambar='$GAMBAR' where idvideo='$ID' ";
}
$result=mysql_query($query);
if($result){
$msg="Data successfully saved / updated";
header("refresh:0; url=?page=video");
}else{
$msg="Data failed stored / updated";
header("refresh:0; url=?page=video");
}
echo json_encode($msg);
break;
default:
echo json_encode("error");
break;
}
?>
Then, how can i take the value of input file types with ajax and then upload an image file and saves it into a MySQL database with ajax. Thank you very much for reading this and sorry if there are less. :)
</div>
Hello Wahyudi Andrian,
If you need to save the image I would recommend you something like this: Php code:
<?php
error_reporting(0);
include "../../config/conn.php";
$ACTION=$_POST['action'];
switch($ACTION){
case "commit":
$ID=$_POST['id'];
$NAME=$_POST['name'];
$DATE=$_POST['date'];
$IMAGE=$_POST['image'];
// Image Details...
$IMAGE = $_FILES['image']['name'];
$IMAGE_SIZE =$_FILES['image']['size'];
$IMAGE_TMP =$_FILES['image']['tmp_name'];
$IMAGE_TYPE=$_FILES['image']['type'];
$chk_ext = explode(".",$IMAGE);
$expensions= array("jpeg","jpg","png"); // Extension of the files
if( $IMAGE != null ){
if( in_array(strtolower(end($chk_ext)),$expensions)=== false ){
$err[]= '[Error] Extension not allowed';
}
}
if( count($err) == 0 ){
$file_name = $sku.".".strtolower(end($chk_ext));
$url_imagen = "url_of_the_images/".$file_name;
move_uploaded_file("url_of_the_images/".$file_name);
if($ID==""){
$query="insert into tb_video (videoname, urlembed, datecreated, gambar)values('$NAME','$url_imagen', '$DATE', '$IMAGE')";
}else{
$query="update tb_video set videoname='$NAME',urlembed='$url_imagen',datecreated='$DATE', gambar='$GAMBAR' where idvideo='$ID' ";
}
$result=mysql_query($query);
}
if($result){
$msg="Data successfully saved / updated";
header("refresh:0; url=?page=video");
}else{
$msg="Data failed stored / updated";
header("refresh:0; url=?page=video");
}
echo json_encode($msg);
break;
default:
echo json_encode("error");
break;
}
In this example you can see that I am using a folder to save the image and I added the url into the table. I hope it can be of help.