1

Necesito mostrar una alerta y detener la ejecucion del script cuando el usuario de clic en el boton de aceptar cuando no selecciona ninguna semana para pagar, esta es la función ajax:

$('#sub').click( function() {         
  $("#update").submit(function(e){
  var formData = new FormData(this);
  e.preventDefault();
  $.ajax({
    url: "files/hoursToPay.php",
          type: "POST",
          data:  formData,
          contentType: false,
          cache: false,
          processData: false,
          success: function(data){
              alert("Horas pagadas");
          },
          error: function(data){
              console.log(data)
          }
        });
      });
    });

Dentro del script hoursToPay:

<?php

// Si seleccionó al menos una semana
if (isset($_POST['hours'])):
    //Codigo para pagar semanas
else:
    echo '<script>alert("Selecciona al menos una semana"); 
    return false;</script>';
endif;
?>

El problema es que el codigo javascript que esta dentro del script no funciona, hay alguna manera de hacerlo funcionar?, gracias.

2 respuestas 2

0

¿Y por qué dejar que el usuario haga clic en el botón si el formulario no está debidamente cumplimentado?

La solución que propongo es muy simple:

  • El botón enviar estará desactivado mientras que el input requerido no tenga datos
  • Para controlar eso escucharemos los eventos change, paste y keyup en ese input:

$(function() {
  /*Creamos referencias a los elementos*/
  var $btnEnviar = $("#btnEnviar");
  var $ibxSemana = $("#ibxSemana");

  /*Variable que se posteará*/
  var $postVal = "";

  /*De entrada desactivamos el botón*/
  $btnEnviar.prop("disabled", true);

  /*Aquí escuchamos los cambios en el input*/
  $ibxSemana.on("change paste keyup", function() {
    /*Recogemos el valor del input*/
    $postVal = $.trim($(this).val());
    
    /*Determinamos si está o no vacío para activar o no el botón*/
    var btnDisabled = ($postVal == "") ? true : false;

    /*Cambiamos o  no  el estado del botón según el valor de btnDisabled*/
    $btnEnviar.prop("disabled", btnDisabled);

  });

  /*
   *Se ejecutará al hacer clic en el botón
   *aquí pones tu llamada Ajax
   */
  $btnEnviar.click(function(event) {
    event.preventDefault();
    console.log(`Aquí la petición Ajax, usando la variable $postVal cuyo valor actual es ${$postVal}`);
  });


});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="tuarchivo.php" method="post">
  <p>
    <label for="usuario">Semana:
<input id="ibxSemana" type="text" name="semana" required /></label>
  </p>
  <p>
    <button id="btnEnviar" type="submit" name="enviar">Enviar</button>
  </p>
</form>

1
  • Ok esa tmb puede ser una opción, lo unico que hice fue agregar este codigo: $("input:checkbox").on(\'change\', function() { $(\'#sub\').prop("disabled", !this.checked); }).trigger(\'change\'); Dado que son puros checkboxes, gracias. el 4 oct. 2018 a las 14:51
0

Para poder ejecutar el alert con AJAX no es necesario convocar a un archivo PHP, puedes intentar

$('#sub').click( function() {         
  $("#update").submit(function(e){
  var formData = new FormData(this);
  var horasPagadas = variableHTML //-----
  e.preventDefault();
  $.ajax({
   url: "files/hoursToPay.php",
      type: "POST",
      data:  formData,
      contentType: false,
      cache: false,
      processData: false,
      success: function(horasPagadas){
          alert("Horas pagadas" . horasPagadas );
      },
      error: function(data){
          console.log(data)
      }
    });
  });
});
1
  • Y en el caso de que el usuario no seleccione nada como interrumpo la ejecución del script? el 4 oct. 2018 a las 1:50

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.