Place swal inside a js function

Asked

Viewed 2,734 times

0

Guys I have a function to delete a student, only I’m not able to put together a design I made using swal someone could help me?

function excluiraluno(id){

  decisao = confirm('Deseja deletar?');

  if(decisao){
    $.ajax({ 
      url: "EditaExcluiAluno.php",
      dataType: "html",
      type: "POST",
      data: { id: id},

      success: function(data){
        $('#painelAbas').html(data);
      },

    });
  }
}

I want to put this swal inside this function but I’m not getting it

<!DOCTYPE html>
<html>

<head>
  <link data-require="sweet-alert@*" data-semver="0.4.2" rel="stylesheet" href="sweetalert.min.css" />
  <script src="sweetalert.min.js"></script>
   <link rel="stylesheet" type="text/css" href="styleExcluir.css"> 
</head>

<body>
  <form id="from1">
    <button>Excluir</button>
  </form>

  <script>
    document.querySelector('#from1').addEventListener('submit', function(e) {
      var form = this;

      e.preventDefault();

      swal({
          title: "Deseja Excluir?",
          icon: "warning",
          buttons: [
            'Cancelar',
            'Excluir'
          ],
          dangerMode: true,
        }).then(function(isConfirm) {
          if (isConfirm) {
            swal({
              title: 'Excluido com Sucesso!',
              timer: 2000,
              icon: 'success'
            }).then(function() {
              form.submit();
            });
          } else {
            swal("Cancelado com Sucesso", "", "success");
          }
        });
    });
  </script>


</body>

</html>
javascript html

1 answer

1

You are submitting the form, even canceling its submission before. Now I would make a change to the code

  • Add one more parameter in the student exclude function, which would be a callback
  • After the if (isConfirm) would call the student exclusion function, the callback would be the swal that confirms the student’s exclusion.
  • And finally I would call this callback only if ajax successfully returned the delete message. In the case after that code $('#painelAbas').html(data);

I commented on the code that is sending the form.

    <script>

    document.querySelector('#from1').addEventListener('submit', function(e) {
      var form = this;

      e.preventDefault();

      swal({
          title: "Deseja Excluir?",
          icon: "warning",
          buttons: [
            'Cancelar',
            'Excluir'
          ],
          dangerMode: true,
        }).then(function(isConfirm) {
          if (isConfirm) {
            excluiraluno(id);

            swal({
              title: 'Excluido com Sucesso!',
              timer: 2000,
              icon: 'success'
            }).then(function() {
               // form.submit(); voce tem que tirar esse form.submit() e adicionar a funcao
            });
          } else {
            swal("Cancelado com Sucesso", "", "success");
          }
        });
    });
  </script>

Browser other questions tagged javascript html

You are not signed in. Login or sign up in order to post.