Upload file gambar tanpa menggunakan tag form

salam master semua, maaf saya baru belajar, saya seorang honor dan ingin membuat web di tempat saya kerja, karena sering kendala dalam data permasalahan saya sayang mau input foto anak habis di crop dengan Cropped untuk menyimpan upload saya masih salah dan sudah mencari cari dan tidak mau menyimpan juga .mohon bantunya master semua kode

ajax.js

<script>

    window.addEventListener('DOMContentLoaded', function () {
      var avatar = document.getElementById('avatar');
      var image = document.getElementById('image');
      var input = document.getElementById('input');
      var $progress = $('.progress');
      var $progressBar = $('.progress-bar');
      var $alert = $('.alert');
      var $modal = $('#modal');
      var cropper;

      $('[data-toggle="tooltip"]').tooltip();

      input.addEventListener('change', function (e) {
        var files = e.target.files;
        var done = function (url) {
          input.value = '';
          image.src = url;

          $modal.modal('show');
        };
        var reader;
        var file;
        var url;

        if (files && files.length > 0) {
          file = files[0];

          if (URL) {
            done(URL.createObjectURL(file));
          } else if (FileReader) {
            reader = new FileReader();
            reader.onload = function (e) {
              done(reader.result);
            };
            reader.readAsDataURL(file);
          }
        }
      });

      $modal.on('shown.bs.modal', function () {
        cropper = new Cropper(image, {
          dragMode: 'move',
        aspectRatio: 3 / 4,
        autoCropArea: 0.65,
        restore: false,
        guides: false,
        center: false,
        highlight: false,
        cropBoxMovable: false,
        cropBoxResizable: false,
        toggleDragModeOnDblclick: false,
        });
      }).on('hidden.bs.modal', function () {
        cropper.destroy();
        cropper = null;
      });

      document.getElementById('crop').addEventListener('click', function () {
        var initialAvatarURL;
        var canvas;

        $modal.modal('hide');

        if (cropper) {
          canvas = cropper.getCroppedCanvas({
            width: 160,
            height: 160,
          });
          initialAvatarURL = avatar.src;
          avatar.src = canvas.toDataURL();
          $progress.show();
          $alert.removeClass('alert-success alert-warning');
          canvas.toBlob(function (blob) {
            var formData = new FormData();

            formData.append("file", document.getElementById('avatar').files[0]);;
            $.ajax( {
				url:"upload_foto_siswa.php",
              method: 'POST',
              data: formData,
              processData: false,
              contentType: false,

              xhr: function () {
                var xhr = new XMLHttpRequest();

                xhr.upload.onprogress = function (e) {
                  var percent = '0';
                  var percentage = '0%';

                  if (e.lengthComputable) {
                    percent = Math.round((e.loaded / e.total) * 100);
                    percentage = percent + '%';
                    $progressBar.width(percentage).attr('aria-valuenow', percent).text(percentage);
                  }
                };

                return xhr;
              },

              success: function () {
                $alert.show().addClass('alert-success').text('Upload success');
              },

              error: function () {
                avatar.src = initialAvatarURL;
                $alert.show().addClass('alert-warning').text('Upload error');
              },

              complete: function () {
                $progress.hide();
              },
            });
          });
        }
      });
    });
  </script>

upload.php

<?php
  include('../ro-databases/koneksi.php');

 $query = "SELECT * FROM user_siswa_man2 WHERE nisn='".$_SESSION['username']."'";
 $result= mysqli_query($koneksi, $query);
    while($row = mysqli_fetch_array($result))
		{

	$nisn=$row['nisn'];
		$tanggal_lahir=$row['tanggal_lahir'];
		$nama_siswa=$row['nama_siswa'];
		$id=$row['id'];


		}

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

 $fileName = $_FILES['file']['name'];
  // Simpan ke Database
  $sql = "UPDATE user_siswa_man2 SET foto_siswa='$fileName' where id='$id'";
  mysqli_query($koneksi, $sql);
  // Simpan di Folder Gambar
  move_uploaded_file($_FILES['file']['tmp_name'], "../foto_siswa/".$_FILES['file']['name']);
  echo"<script>alert('Gambar Berhasil diupload !');history.go(-1);</script>";
 }

?>

mohon bantunya master saya sangat berterima kasih