Edit

[EDIT] FILE: app.js

var selectedImage = "";
const fileInput = document.querySelector('input[type=file]') ? document.querySelector('input[type=file]') : "";
const handleImages = (files) => {
  let validImages = [...files].filter((file) =>
    ['image/jpeg', 'image/png'].includes(file.type)
  );
  validImages.forEach(showImage);
};

const showImage = (image) => {
  const reader = new FileReader();
  reader.readAsDataURL(image);
  reader.addEventListener('load', (e) => {
    console.log("File: ", e.target.result);
    selectedImage = e.target.result;
  });
};
if(fileInput){
  fileInput.addEventListener('change', (e) => {
    selectedImage = "";
    const { files } = e.target;
    console.log("File: ", e.target.files[0]);
    if(e.target.files[0]){
      alert("found");
    }
    // handleImages(files);
  });
}
$("body").on("submit", "form", function(e){
  e.preventDefault();
  var formData = $(this).serialize();
  var url = "";
  var file = $(this).find("input[type=file]");
  var submitting = false;
  if(file.length >= 1){
    url = formData+"image="+selectedImage;
    if(selectedImage){
      submitting = true;
    }else{
      submitting = false;
      alert("Invalid Image");
    }
  }else{
    url = formData;
    submitting = true;
  }
  console.log("Image: ", selectedImage);
  console.log("File: ", file);
  if(submitting){
    $.ajax({
      url:"command.php",
      type:"POST",
      data:url,
      contentType:false,
      cache:false,
      processData:false,
      success:function(data){
        if(data == "OK"){
          toastr.success('Successfull.');
          // $(".close").click();
          // show_product();
          // show_spec();
          // show_image();
          // show_category();
          // show_gallery();
        }else{
          toastr.error(data);
        }
      }
    });
  }
});

CANCEL