0

Buen dia,

Primero aclaro que tenglo un plugin que es el alertify, para unas alertas mas dinamicas, en este momento tengo un formulario en el cual subo datos de un paciente de una clinica, pero este formulario tiene un input file con el cual tengo unas validaciones las cuales son que no se debe repetir los nombres, que no debe de superar x tamaño, validar tambien que sean .pdf.

Aqui mi codigo .php llamado agregar, como pueden ver hago las validaciones que digo anteriormente, igualmente aclaro que tengo una variable llamado $uploadOk que la tengo por defecto en igual a 1, esto por si en alguna validacion llegue a ser afirmativa se convierte en 0 para acabar con la consulta.

    // Verificar si existe el archivo
if (file_exists($target_file)) {
   echo "Lo sentimos, archivo ya existe.";
    $uploadOk = 0;
}
// Verificar el tamaño
if ($_FILES["file"]["size"] > 5242808) {
    echo "Lo sentimos, el archivo es demasiado grande.  Tamaño máximo admitido: 5 MB";
    $uploadOk = 0;
}
// Verificar el tipo de archivo
if($imageFileType != "pdf" ) {
    echo "Lo sentimos, sólo se permiten archivos PDF.";
    $uploadOk = 0;
}
// Verificar que la variable $uploadok no se haya visto cambiada
if ($uploadOk == 0) {
    echo "Lo sentimos, tu archivo no fue subido.";
// Si la variable no fue modificada ejecutar la consulta en mysqli.
} else {
    if (move_uploaded_file($_FILES["file"]["tmp_name"], $target_file)) 

Tambien quiero especificar que los datos de el formulario y de la consulta y demas no lo agrego debido a que todo esta funcionando bien, solo quiero implementar como plus esas alertas para que el usuario sepa que esta sucediendo, teniendo en cuenta esto añado el codigo ajax que tengo en mi script.

$.ajax({
                type: 'POST',
                url: 'procesos/agregar.php',
                data: new FormData(this),
                contentType: false,
                cache: false,
                processData: false,
                beforeSend: function() {
                    $('.submitBtn').attr("disabled", "disabled");
                    $('#frmnuevo').css("opacity", ".5");
                },
                success: function(msg) {
                
                    
                        $('#frmnuevo')[0].reset();
                        $('#tablaDatatable').load('tabla.php');
                        alertify.success("Se agrego con exito :D");
                    } else {
                        alertify.failed("No se puedo agregar paciente);
                    }
                    $('#frmnuevo').css("opacity", "");
                    $(".submitBtn").removeAttr("disabled");
                }
            });

El unico alertify que tengo es para cuando se devuelva la consulta y si ha sido confirmada me arroje un alertify con que fue agregado, y si hubo algun error tengo otro alertify pero con su respectivo mensaje.

Algun consejo de como puedo hacer esto con este plugin?


EDIT:

Siguiendo los consejos, y hacer los respectivos cambios ahora tengo un problema, ahora no me envia nada del formulario.

el input quedo fuera del form de la siguiente manera:

<button type="button" id="btnAgregarnuevo" name="submit" class="btn btn-primary submitBtn"></button>

Y el ajax o el script clompleto quedo de la siguiente manera:;

$(document).ready(function() {
        
        $('#btnActualizar').click(function() {
            const formElement = document.querySelector("frmnuevo"); 
            $.ajax({
                type: 'POST',
                url: 'procesos/agregar.php',
                data: new FormData(formElement),
                contentType: false,
                cache: false,
                processData: false,
                beforeSend: function() {
                    $('.submitBtn').attr("disabled", "disabled");
                    $('#frmnuevo').css("opacity", ".5");
                },
                success: function(data) {
                    if(data.status){
                        $('#frmnuevo')[0].reset();
                        $('#tablaDatatable').load('tabla.php');
                        alertify.success("Se agrego con exito :D");
                        return; // Detenemos el código
                }        //En caso de que exista un error lo mostramos
               alertify.failed(data.message);
                
                    else {
                        $('.statusMsg').html('<span style="font-size:18px;color:#EA4335">No ha subido el paciente.</span>');
                    }
                    $('#frmnuevo').css("opacity", "");
                    $(".submitBtn").removeAttr("disabled");
                }
            });
        });

Este es la function que tengo para enviar los input file:

$("#file").change(function() {
            var file = this.files[0];
            var imagefile = file.type;
            var match = ["application/pdf"];
            if (!((imagefile == match[0]))) {
                alert('Please select a valid image file (pdf).');
                $("#file").val('');
                return false;
            }

Y las validaciones de php quedaron de la siguiente manera:

header("Content-Type: application/json");
    $response = array('status'=>false, 'message'=>null);




// Check if file already exists
if (file_exists($target_file)) {
   $response['message'] = "Lo sentimos, archivo ya existe."; 
   echo json_encode($response);
    $uploadOk = 0;
    exit(); //Detenemos el código
            });
        });
12
  • Si no me equivoco ¿Quieres mostrar una alerta con alertify dependiendo de lo que responda el php?, puedes confirmarme.
    – Spearking
    Commented el 7 oct. 2022 a las 18:27
  • @Spearking, asi es, eso es lo que deseo, una alerta para cada validacion que responda el php. De igual manera probare con el codigo que me enviaste. Muchas gracias Commented el 7 oct. 2022 a las 19:47
  • Espero te sirva, un gusto.
    – Spearking
    Commented el 7 oct. 2022 a las 19:50
  • @Spearking, que pena molestarte. No se que hice mal porque ahora al momento de guardar el registro del paciente, solo me recarga la pagina con la diferencia de ahora es que la url ahora queda de esta manera: localhost/datatable%20-%20copia/referencias/… Osea me abarca todo el formulario cosa que no sucedia antes Commented el 7 oct. 2022 a las 20:00
  • Haz cambiado algo en el formulario sin darte cuenta tal vez un botón que haz añadido o un input para enviarlo porque se está enviando el formulario, probablemente si es así debas ponerle el type="button" para que no se envíe el formulario y se envíe con el javascript.
    – Spearking
    Commented el 7 oct. 2022 a las 20:03

1 respuesta 1

0

Para hacer eso deberías retornar un JSON similar a este con PHP:

{
   "status" : "true",
   "message" : "message"
}

Para hacerlo puedes cambiar algunas cosas en tu archivo por ejemplo:

header("Content-Type: application/json");
$response = array('status'=>false, 'message'=>null);

    // Verificar si existe el archivo
if (file_exists($target_file)) {
   $response['message'] = "Lo sentimos, archivo ya existe."; 
   echo json_encode($response);
   exit(); //Detenemos el código
}

//Si todo está bien retornamos true en el status
$response['message'] = "success"; 
$response['status'] = true; 
echo json_encode($response);
exit(); //Detenemos el código

Ahora que hemos cambiado todas las respuestas, desde el frontend podemos hacer lo siguiente:

$.ajax({
                type: 'POST',
                url: 'procesos/agregar.php',
                data: new FormData(this),
                contentType: false,
                cache: false,
                processData: false,
                beforeSend: function() {
                    $('.submitBtn').attr("disabled", "disabled");
                    $('#frmnuevo').css("opacity", ".5");
                },
                success: function(data) {

                //Si todo va bien mostramos que todo fue un éxito
                if(data.status){
                        $('#frmnuevo')[0].reset();
                        $('#tablaDatatable').load('tabla.php');
                        alertify.success("Se agrego con exito :D");
                        return; // Detenemos el código
                }

               //En caso de que exista un error lo mostramos
               alertify.failed(data.message);
                
                    

                    } else {
                        alertify.failed("No se puedo agregar paciente);
                    }
                    $('#frmnuevo').css("opacity", "");
                    $(".submitBtn").removeAttr("disabled");
                }
            });

Espero haberte ayudado.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.