upload gambar dengan jquery ajax php tidak berfungsi

halo semua..

saya mau bertanya tentang masalah upload gambar dengan jquery ajax php, jadi begini saya sedang mengerjakan project belajar membuat online shop menggunakan jquery ajax nah saya sudah buat form tambah data penjualan nya dan disitu user harus memasukan gambar yang ingin di jual nya. misal user mau jual handphone atau buku nah si user harus memasukan gambar nya biar si pembeli bisa melihat fisik nya melalui gambar tersebut. contohnya kaya di OLX si user bisa upload dan hapus gambar sebelum tombol submit nya di klik.

untuk lebih jelas nya saya perlihatkan tampilan di browswer saya sebelum gambar di upload

dan yang ini setelah gambar di upload

permasalahan nya pada saat pertama saya memasukan gambar nya di form tersebut dia berhasil menampilkan gambar nya di browser lalu ketika saya hapus gambar tersebut kemudian saya upload gambar nya lagi dia tidak berfungsi atau dia tidak menjalan kan proses upload nya. bagaimana menurut para mastah, apakah ada yang salah di kodingan saya atau ada cara lain yang sekira nya bisa membuat pikiran saya lebih cerah...

ini saya perlihatkan juga kodingan ajax upload gambar nya

$('#file').change(function(){
              var data = new FormData(this);
	            data.append('file', $(file)[0].files[0]);

              $.ajax({
                url: 'tampil_foto.php',
              	type: 'POST',
              	cache: false,
              	contentType: false,
              	processData: false,
              	data: data,
              	success: function(data){
                  setTimeout(function(){
                    $('.content').html(data);
                  }, 5000);
                    $('.upload-plus').html('<i class="fa fa-spinner fa-pulse fa-fw"></i>');
                }
              });
            });

ini kodingan php upload gambar nya

<?php

    if (isset($_FILES['file']['name'])) {

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

        $format = pathinfo($nama, PATHINFO_EXTENSION);
        $path = 'asset/' . $nama;

        if ($nama !== '') {

          if ($masalah === 0) {

            if ($ukuran < (1024 * 1024)) {

              if ($format === 'jpg' || $format === 'png' || $format === 'jpeg') {
                move_uploaded_file($asal, "asset/" . $nama);
                echo '<img src="'.$path.'" id="img_1" width="100" height="100">
                      <span id="delete_1" data-path="'.$path.'">Delete</span>';
              }else{
                echo "<script>alert('File Di Masukan Harus JPG, JPEG dan PNG');</script>";
              }

            }else {
              echo "<script>alert('File Yang Anda Masukan Terlalu Besar');</script>";
            }

          }else {
            echo "<script>alert('Ada Masalah Saat Memasukan File');</script>";
          }

        }else {
          echo "<script>alert('Mohon Masukan File');</script>";
        }
    }
?>

catatan: 1. disini saya belum menggunakan database. 2. saya sudah inspect element dan tidak ada error nya.

semoga pertanyaan saya jelas..

mohon pencerahan nya. terima kasih.