upload file menggunakan ajax dan php, tanpa menggunakan tag form

pake formData, contoh <pre> var file_data = $("#file").prop("files")[0]; //input file untuk upload var id = '0001'; var form_data = new FormData();
form_data.append("file", file_data); // variable untuk tampung file upload form_data.append("id", id); // variable untuk tampung id

					    $.ajax({
			                url:"/upload.php",  // point to server-side PHP script 
			                dataType: "html",  // what to expect back from the PHP script, if anything
			                cache: false,
			                contentType: false,
			                processData: false,
			                data: form_data,                         
			                type: "POST",
			                success: function(data){} }); </pre>

klau untuk variabel departemen,tujuan dll apakah harus di buatkan vaiabel jg:

<pre> var tujuan var departemnt </pre>

maaf sebelumnya saya baru belajar ajax

iya, tinggal tambahkan. sesuai apa saja data yang dikirim menggunakan ajax <pre> form_data.append("tujuan", tujuan); form_data.append("department", department); </pre>

datanya blum bisa masuk,bisa mungkin di koreksi lagi :

<pre>

function simpanDetail(){
	var file_data=$("#filename").prop("files")[0];
//	var id='0001';
	var id	= $("#id").val();
	var usulan	= $("#usulan").val();
	var tujuan		= $("#tujuan").val();
	var deskripsi	= $("#deskripsi").val();
	var qty	= $("#qty").val();

	var form_data= new FormData();
	form_data.append("filename",file_data);
	form_data.append("id",id);
	form_data.append("tujuan",tujuan);
	form_data.append("deskripsi",deskripsi);
	form_data.append("qty",qty);
	form_data.append("usulan",usulan);

	if(id.length==0){
		alert('Maaf, no_usulan tidak boleh kosong');
		$("#id").focus();
		return false();
	}
	if(usulan.length==0){
		alert('Maaf, tgl usulan tidak boleh kosong');
		$("#usulan").focus();
		return false();
	}
	if(tujuan.length==0){
		alert('Maaf, tujuan tidak boleh kosong');
		$("#tujuan").focus();
		return false();
	}
	if(deskripsi.length==0){
		alert('Maaf,deskripsi tidak boleh kosong');
		$("#deskripsi").focus();
		return false();
	}
	if(qty.length==0){
		alert('Maaf,qty tidak boleh kosong');
		$("#qty").focus();
		return false();
	}
	$.ajax({
		type	: "POST",
		url		: "modul/pinjaman2/simpan_detail.php",
		cache	:false,
		contenType :false,
		processData :false,
		data 	: form_data,

		/*
		data	: "id="+id+
				"&usulan="+usulan+
				"&tujuan="+tujuan+
				"&qty="+qty+
				"&deskripsi="+deskripsi,
		*/
				success	: function(data){
		$(".input").val('');
			$("#tampil_data1").load('modul/pinjaman2/tampil_data_cicilan.php');
		buatNomor();
		}
	});
	
}

</pre>

1. cek console, apakah ada error atau tidak
2. coba variable post di simpan_detail.php pake kutip, contoh <pre> $_POST[usulan]; // ubah jadi $_POST['usulan']; $_FILES['data_upload']['name']; // ubah jadi $_FILES['file']['name']; </pre>
3. coba di file simpan_detail.php, echo hasil post ajax.

sdah saya echo post hasil ajax nya, semuanya terbaca keculai variabel id dan variabel filename

filename sudah bisa terbaca, tinggal idnya yang belum gan

coba cek apakah input id sudah ada isinya, jangan lupa kasih tak "id='id'" di input id

Maaf gan ternyata saya pake form method tdi , makanya semua variabelnya terbaca pas di echo di simpan_detail.php,pas saya hilangkan form nya , malah smua variabel dari ajax Notice: Undefined index:...kyaknya msih ada slah di ajaxnya gan...

error apa di console gan?

begini gan :

Notice: Undefined index: id in D:\xampp\htdocs\osga_backup\modul\pinjaman2\simpan_detail.php on line 8

Notice: Undefined index: usulan in D:\xampp\htdocs\osga_backup\modul\pinjaman2\simpan_detail.php on line 10

Notice: Undefined index: tujuan in D:\xampp\htdocs\osga_backup\modul\pinjaman2\simpan_detail.php on line 11

Notice: Undefined index: deskripsi in D:\xampp\htdocs\osga_backup\modul\pinjaman2\simpan_detail.php on line 12

Notice: Undefined index: qty in D:\xampp\htdocs\osga_backup\modul\pinjaman2\simpan_detail.php on line 13

Notice: Undefined index: filename in D:\xampp\htdocs\osga_backup\modul\pinjaman2\simpan_detail.php on line 14

Notice: Undefined index: filename in D:\xampp\htdocs\osga_backup\modul\pinjaman2\simpan_detail.php on line 15

di file simpan_detail.php, sudah ditambahkan kutip ya, contoh $_POST['id']; kalo masih error, coba copas codingan terbaru agan

sudah saya tambahkan gan tapi teteap sama :

simpan_detail.php <pre> &lt;?php session_start(); $dept=$_SESSION['namauser']; ?&gt; &lt;?php include "../../inc/inc.koneksi.php"; $table ="usul".$dept; $id =$_POST['id']; //variabel terbaca $usulan =$_POST['usulan']; $tujuan =$_POST['tujuan']; $deskripsi =$_POST['deskripsi']; $qty =$_POST['qty']; $file_name = $_FILES['filename']['name']; $file_size = $_FILES['filename']['size']; // /* if (isset($_POST['filename'])) {

$file_name =$_POST['filename'] ; echo "&lt;H1&gt;".$file_name."&lt;/H1&gt;";

} */ echo"&lt;h1&gt;".$id."&lt;/h1&gt;&lt;br&gt;"; echo"&lt;h1&gt;".$file_name."&lt;/h1&gt;&lt;br&gt;"; echo"&lt;h1&gt;".$file_size."&lt;/h1&gt;&lt;br&gt;"; echo"&lt;h1&gt;".$usulan."&lt;/h1&gt;&lt;br&gt;"; echo"&lt;h1&gt;".$tujuan."&lt;/h1&gt;&lt;br&gt;"; echo"&lt;h1&gt;".$deskripsi."&lt;/h1&lt;br&gt;"; echo"&lt;h1&gt;".$qty."&lt;/h1&gt;";

$eror = false; $folder = '../../upload/'; $file_type = array('jpg','jpeg','PNG','gif','bmp','doc','docx','xls','xlsx','sql'); $max_size = 1000000; // 1MB

$sql = mysql_query("SELECT * FROM $table WHERE id= '$id' and deskripsi='$deskripsi' and tujuan='$tujuan'"); $row = mysql_num_rows($sql); if ($row&gt;0){ $input = "UPDATE $table SET qty='$qty' where id= '$id' and tujuan='$tujuan' and deskripsi='$deskripsi'"; mysql_query($input); echo "&lt;b&gt;Data Sukses diubah&lt;/b&gt;"; }else{

$file_name	= $_FILES['filename']['name'];
$file_size	= $_FILES['filename']['size'];
//cari extensi file dengan menggunakan fungsi explode
$explode	= explode('.',$file_name);
$extensi	= $explode[count($explode)-1];

//check apakah type file sudah sesuai
if(!in_array($extensi,$file_type)){
	$eror   = true;
	$pesan .= '- Type file yang anda upload tidak sesuai<br />';
}
if($file_size > $max_size){
	$eror   = true;
	$pesan .= '- Ukuran file melebihi batas maximum<br />';
}
//check ukuran file apakah sudah sesuai

if($eror == true){
	echo '<div id="eror">'.$pesan.'</div>';
}
else{
	//mulai memproses upload file
	if(move_uploaded_file($_FILES['filename']['tmp_name'], $folder.$file_name)){

	$input = "INSERT INTO $table (id,usulan,tujuan,deskripsi,qty,dept,filename)
		VALUES('$id','$usulan','$tujuan','$deskripsi','$qty','$dept','$file_name')";
	mysql_query($input);
	echo "<b>Data sukses disimpan</b>";
	echo '<div id="msg">Berhasil mengupload file '.$file_name.'</div>';
	} else{
		echo "Proses upload eror";
	}
}

} ?&gt; </pre>

ajax.js

<pre> // JavaScript Document $(document).ready(function(){ $(function(){ $('button').hover( function() { $(this).addClass('ui-state-hover'); }, function() { $(this).removeClass('ui-state-hover'); } ); }); $("#nomor").keyup(function(e){ var isi = $(e.target).val(); $(e.target).val(isi.toUpperCase()); }); $('#tabs').tabs(); $("#tgl").datepicker({ dateFormat:"dd-mm-yy"
}); $("#tgl1").datepicker({ dateFormat:"dd-mm-yy"
}); $("#tgl2").datepicker({ dateFormat:"dd-mm-yy"
}); $("#qty").keypress(function (data) { if(data.which!=8 && data.which!=0 && (data.which&lt;48 || data.which&gt;57)){ return false; } }); $("#bunga").keypress(function (data) { if(data.which!=8 && data.which!=0 && (data.which&lt;48 || data.which&gt;57)){ return false; } });

$("#form_isian").hide();
$("#tampil_data1").load('modul/pinjaman2/tampil_data1.php');
function buatNomor(){
	var id	= '0001';
	$.ajax({
		type	: "POST",
		url		: "modul/pinjaman2/cari_nomor.php",
		data	: "id="+id,
		dataType : "json",
		success	: function(data){
			$("#id").val(data.id);
		}
	});
}

function tab(){
	var id	= '0001';
	$.ajax({
		type	: "POST",
		url		: "modul/pinjaman2/tab.php",
		data	: "id="+id,
		dataType : "json",
		success	: function(data){
			$("#id").val(data.id);
		}
	});
}

function buat(){
	var id	= '0001';
	$.ajax({
		type	: "POST",
		url		: "modul/pinjaman2/up_os.php",
		data	: "id="+id,
		dataType : "json",
		success	: function(data){
		}
	});
}
$("#tambah").click(function(){
	$("#form_isian").show();
	$("#menu-tombol1").hide();
	buatNomor();
	tab();
	$("#nomor").focus();
	var no = $("#no").val();
	$("#tampil_data1").load('modul/pinjaman2/tampil_data_cicilan.php?cari='+no);
})
$("#simpan").click(function(){
	simpanDetail();
})

function simpanDetail(){
	
	var file_data=$("#filename").prop("files")[0];
	//var id='0001';

	var id	=     $("#id").val();
	var usulan	= $("#usulan").val();
	var tujuan		= $("#tujuan").val();
	var deskripsi	= $("#deskripsi").val();
	var qty	= $("#qty").val();
	var filename	= $("#filename").val();

/* var form_data= new FormData(); form_data.append("filename",file_data); form_data.append("id",id); form_data.append("tujuan",tujuan); form_data.append("deskripsi",deskripsi); form_data.append("qty",qty); form_data.append("usulan",usulan); */ if(id.length==0){ alert('Maaf, no_usulan tidak boleh kosong'); $("#id").focus(); return false(); } if(usulan.length==0){ alert('Maaf, tgl usulan tidak boleh kosong'); $("#usulan").focus(); return false(); } if(tujuan.length==0){ alert('Maaf, tujuan tidak boleh kosong'); $("#tujuan").focus(); return false(); } if(deskripsi.length==0){ alert('Maaf,deskripsi tidak boleh kosong'); $("#deskripsi").focus(); return false(); } if(qty.length==0){ alert('Maaf,qty tidak boleh kosong'); $("#qty").focus(); return false(); } $.ajax({ type : "POST", url : "modul/pinjaman2/simpan_detail.php", cache :false, contenType :false, processData :false, data : "form_data",

	/*			data	: "id="+id+
				"&usulan="+usulan+
				"&tujuan="+tujuan+
				"&qty="+qty+
				"&deskripsi="+deskripsi+
				"&filename="+filename,
	*/	
	/*	data: $(this).serialize(),*/
				success	: function(data){
		$(".input").val('');
			$("#tampil_data1").load('modul/pinjaman2/simpan_detail.php');
		buatNomor();
		}
	});
	
}
$("#tutup").click(function(){
	buat();
	$(".input").val('');
	buatNomor();
	$("#form_isian").hide();
	$("#menu-tombol1").show();
	$("#tampil_data1").load('modul/pinjaman2/tampil_data1.php');
	//location.reload()
})
$("#id1").change(function(){
	var id = $("#id").val();
	cariAnggota(id);
})
function cariAnggota(e){
	var id = e;
	$.ajax({
		type	: "POST",
		url		: "modul/pinjaman2/cari_anggota1.php",
		data	: "id="+id,
		success	: function(data){
		$("#info_anggota").html(data);
		$("#permintaan").val(data.permintaan);
		$("#usulan").val(data.usulan);
		}
	});
}
function cariSimpananAnggota(e){
	var cari = e;
	$.ajax({
		type	: "GET",
		url		: "modul/pinjaman2/tampil_data1.php",
		data	: "cari="+cari,
		success	: function(data){
			$("#tampil_data1").html(data);
		}
	});
}
$("#tujuan").change(function(){
	var cari = $("#tujuan").val();
	cariJenis(cari);
})	
function cariJenis(e){
	var cari = e;
	$.ajax({
		type	: "POST",
		url		: "modul/pinjaman2/cari_anggota1.php",
		data	: "tujuan="+cari,
		dataType: "json",
		success	: function(data){
			$("#departemen").val(data.departemen);
		}
	});
}
$("#cari2").click(function(){
	var tgl1 = $("#tgl1").val();
	var tgl2 = $("#tgl2").val();	
	if(tgl1.length==0){
		alert('Maaf, Tanggal tidak boleh kosong');
		$("#tgl1").focus();
		return false();
	}
	if(tgl2.length==0){
		alert('Maaf, Tanggal tidak boleh kosong');
		$("#tgl2").focus();
		return false();
	}
	cariData2(tgl1,tgl2);
});
function cariData2(e1,e2){
	var tgl1 = e1;
	var tgl2 = e2;
	
	$.ajax({
		type	: "POST",
		url		: "modul/pinjaman2/tampil_data2.php",
		data	: "tgl1="+tgl1+"&tgl2="+tgl2,
		success	: function(data){
			$("#tampil_data2").html(data);
		}
	});
}

}); </pre>

coba ini di ajax.js <pre> function simpanDetail(){

var file_data=$("#filename").prop("files")[0];

var id	=     $("#id").val();
var usulan	= $("#usulan").val();
var tujuan		= $("#tujuan").val();
var deskripsi	= $("#deskripsi").val();
var qty	= $("#qty").val();

var form_data= new FormData();
form_data.append("filename",file_data);
form_data.append("id",id);
form_data.append("tujuan",tujuan);
form_data.append("deskripsi",deskripsi);
form_data.append("qty",qty);
form_data.append("usulan",usulan);

if(id.length==0){
	alert('Maaf, no_usulan tidak boleh kosong');
	$("#id").focus();
	return false();
}
if(usulan.length==0){
	alert('Maaf, tgl usulan tidak boleh kosong');
	$("#usulan").focus();
	return false();
}
if(tujuan.length==0){
	alert('Maaf, tujuan tidak boleh kosong');
	$("#tujuan").focus();
	return false();
}
if(deskripsi.length==0){
	alert('Maaf,deskripsi tidak boleh kosong');
	$("#deskripsi").focus();
	return false();
}
if(qty.length==0){
	alert('Maaf,qty tidak boleh kosong');
	$("#qty").focus();
	return false();
}
$.ajax({
	type	: "POST",
	url		: "modul/pinjaman2/simpan_detail.php",
	cache	: false,
	contenType :false,
	processData :false,
	data 	: form_data,
		dataType: "html",  // what to expect back from the PHP script, if anything
		success	: function(data){
			$(".input").val('');
			$("#tampil_data1").load('modul/pinjaman2/simpan_detail.php');
			buatNomor();
		}
});

} </pre>

sama gan, msih sama errornya

Coba cek dulu gan di modul pinjaman methodnya get atau post

saya gak pake tag form method @bosque ,actionnya langsung di botton id -> ajax.js -> simpan_detail.php