mau tanya tentang upload image plus insert data dengan php jquery ajax

selamat malam para mastah coding di sekolah koding...

jadi gini om ane punya masalah saat menambah data sekaligus upload gambar ke database, sebelum nya ane sudah pernah buat kasus yang kaya gini dan berhasil tapi tiba tiba ane ngebleng om dan lupa cara nya dan yang lebih berat lagi xampp ane error lalu ane maen hapus aje tuh xampp ane beserta folder folder yang ada di htdocs tanpa pindahin dulu folder htdocs nya yang berisi kegiatan ane selama belajar di sekolah koding...hiks hiks nah sekarang ane lagi bingung banget...

nah ane sedang inget inget lagi nih cara menambah data plus upload gambar ke database dan ane juga sudah buat html sederhana nya kaya gini

<form method="post" enctype="multipart/form-data">
      <input type="text" name="nama" value="" id="nama"><br><br>
      <input type="file" name="file" value="" id="file"><br><br>
      <input type="submit" name="submit" value="Kirim" id="submit">
    </form>

dan yang codingan ajax nya

$('#submit').on('click', function(){
        var nama = $('#nama').val();
        var data = new FormData(this);
	      data.append('file', $(file)[0].files[0]);

        $.ajax({
          url: 'upload.php',
          method: 'POST',
          cache: false,
          contentType: false,
          processData: false,
          data : {namas:nama,file:data},
          success: function(data){
            console.log(data);
            alert(data);
          }
        });
      });

llalu ini codingan php nya

<?php
require_once 'core/init.php';

  $nama     = $_POST['namas'];
  $name     = $_FILES['file']['name'];
  $file     = $_FILES['file']['name'];
  $masalah  = $_FILES['file']['error'];
  $ukuran   = $_FILES['file']['size'];
  $asal     = $_FILES['file']['tmp_name'];

  $format = pathinfo($file, PATHINFO_EXTENSION);

  if (tambah_data($nama,$name)) {

  if ($masalah === 0) {

    if ($ukuran < 5000000) {

      if ($format === 'jpg' || $format === 'png') {
        move_uploaded_file($asal, "asset/" .$file);
        echo "Berhasil";
      }else{
        echo "File Harus JPG atau PNG";
      }
    }else{
      echo "File Yang Dimasukan Terlalu Besar";
    }
  }else{
    echo "Ada Masalah Saat Memasukan Gambar";
  }

}else{
  echo "Ada maslah saat menambah data";
}
?>

<?php
 function tambah_data($nama,$name){
   global $link;

   $query = "INSERT INTO upload(nama,gambar) VALUES('$nama','$name')";
   $result = mysqli_query($link, $query);

   return $result;
 }
?>

ane sudah coba dan hasilnya ke simpen di database nya tapi data nya kosong...

mohon bantuan nya para mastah.. terima kasih.

avatar BadRabbit
@BadRabbit

149 Kontribusi 56 Poin

Diperbarui 6 tahun yang lalu

2 Jawaban:

Jawaban Terpilih

alhamdulillah sudah terselesaikan masalah saya para mastah coding di sekolah koding hehee..

ternyata masalah nya saya lupa memasukan action di form nya...

setelah ditambahkan html nya jadi seperti ini..

<form action="upload.php" method="post" enctype="multipart/form-data">
      <input type="text" name="nama" value="" id="nama"><br><br>
      <input type="text" name="alamat" value="" id="alamat"><br><br>
      <input type="file" name="file" value="" id="file"><br><br>
      <input type="submit" name="submit" value="Kirim" id="submit">
    </form>

terus codingan ajaxnya juga berubah menjadi seperti ini...

$('#submit').on('click', function(){
        var data = new FormData(this);
        data.append('file', $(file)[0].files[0]);
        var nama = $('#nama').val();

        $.ajax({
          url: 'upload.php',
          method: 'POST',
          cache: false,
          contentType: false,
          processData: false,
          data : {data,nama:nama},
          success: function(data){
            alert(data);
          }
        });
      });

kemudian kodingan php nya jadi seperti ini...

<?php
  require_once 'core/init.php';

  global $link;

  $nama = $_POST['nama'];

  $name     = $_FILES['file']['name'];
  $masalah  = $_FILES['file']['error'];
  $ukuran   = $_FILES['file']['size'];
  $asal     = $_FILES['file']['tmp_name'];

  $format = pathinfo($name, PATHINFO_EXTENSION);

  if ($masalah === 0) {

    if ($ukuran < 5000000) {

      if ($format === 'jpg' || $format === 'png') {
          move_uploaded_file($asal, "asset/" .$name);
          $query  = "INSERT INTO upload(nama,gambar) VALUES('$nama','$name')";
          $result = mysqli_query($link, $query) or die(mysqli_error());
          if ($result) {
            echo "Berhasil";
          }else{
            echo "Gagal";
          }
      }else{
        echo "<script>alert('File Yang Dimasukan Harus JPG atau PNG');</script>";
      }
    }else{
      echo "<script>alert('File Yang Dimasukan Terlalu Besar');</script>";
    }
  }else{
    echo "<script>alert('Ada Masalah Saat Menambah Gambar');</script>";
  }
?>

Terima Kasih.

avatar BadRabbit
@BadRabbit

149 Kontribusi 56 Poin

Dipost 7 tahun yang lalu

Kalau saya ikutin jawaban itu ga jalan. beda di ajax nya


$('#submit').on('click', function(){
    var data = new FormData(this);
    data.append('file', $(file)[0].files[0]);
    data.append('nama', $('#nama').val());

    $.ajax({
        url: 'upload.php',
        method: 'POST',
        cache: false,
        contentType: false,
        processData: false,
        data : data,
        success: function(data){
            alert(data);
        }
     });
});

avatar akatipen
@akatipen

1 Kontribusi 0 Poin

Dipost 6 tahun yang lalu

Login untuk ikut Jawaban