estamos implementando un sistema de registro de mascotas, ahora tenemos un problema queremos subir imágenes al servidor, con jquery, php, hemos hecho el siguiente código que no logramos hacer funcionar, también juntos con la imagen se debe de registra en la base de datos junto con el nombre del propietario de la mascota, nombre de la mascota, fecha de nacimiento, edad, etc. , tambien hemos consultado a mucha información en el Internet y no logramos hacerlo funcionar, gracias
<form class="" id="registroMascotaMascotas" enctype="multipart/form-data" method="post">
<div class="modal fade" id="modalMascota" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-body">
<div class="row">
</div>
<div class="row">
<div class="col">
<label for="foto-can">Foto de la mascota</label>
<div class="custom-file">
<input
type="file"
class="custom-file-input"
id="fotoRegisMascota"
accept=".jpg, .png"
name="fotoRegisMascota"
/>
<label
class="custom-file-label"
for="customFileLangHTML"
data-browse="Elegir una foto"
></label>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-danger" data-dismiss="modal">Cancelar <i class="fas fa-times"></i></button>
<button type="button" class="btn btn-primary" id="idGuardarMascota">Guardar <i class="fas fa-save"></i></button>
</div>
</div>
</div>
</div>
Función en JavaScript
function registroMascotas() {
const
fotosMascota = document.getElementById("fotoRegisMascota"),
archivoRuta = fotosMascota.value,
exPermitidas = /(.jpg|.jpeg|.png)$/i,
var formData = new FormData();
var files = $("#fotoRegisMascota")[0].files[0];
formData.append("file", files);
if (numeDocPropietario === "") {
Swal.fire({
type: "error",
title: "Error",
text: "Ingrese el documento de identidad del propietario!"
});
} else {
$("#modalMascota").modal("hide");
}
$.ajax({
type: "POST",
url: "../../pages/tables/mascotaregitramascota.php",
data: Form,
processData: false,
contentType: false,
success: function(r) {
if (r == 1) {
const Toast = Swal.mixin({
toast: true,
position: "top-end",
showConfirmButton: false,
timer: 3000
});
Toast.fire({
type: "success",
title: "Se guardo correctamente"
});
} else {
const Toast = Swal.mixin({
toast: true,
position: "top-end",
showConfirmButton: false,
timer: 3000
});
Toast.fire({
type: "error",
title: "Error con el servidor"
});
}
}
});
}
Script que llama a la función
$(document).ready(function() {
$("#idGuardarMascota").click(function() {
registroMascotas();
});
});
Codigo php
<?php
include_once '../../../includes/templates/conexion.php';
if ($_SERVER['REQUEST_METHOD'] == 'POST' && !empty($_FILES)) {
$check = @getimagesize($_FILES['fotoRegisMascota']['tmp_name']);
if ($check !== false) {
$carpeta_destino = '../../fotosregistrados';
$nombre_archivo =
"imagen_" .
date("dHis") .
"." .
pathinfo($_FILES['fotoRegisMascota']['name'], PATHINFO_EXTENSION);
$archivo_subido = $carpeta_destino . $nombre_archivo;
move_uploaded_file(
$_FILES['fotoRegisMascota']['tmp_name'],
$archivo_subido
);
}
}
?>