user3746183
user3746183

Reputation:

JavaScript sweetAlert popup closes itself after a quick second

I have a SweetAlert popup, but it is closing itself automatically. Normally it should stay until user clicks 'OK'. (I have included and tested all SweetAlert files.)

<button class="btn btn-success" type="submit" name="submit" onclick="myFunction()">Submit</button>

<script>
function myFunction() {
    swal("Submitted!", "Your Issue has been submitted!", "success");
}
</script>

Upvotes: 3

Views: 11465

Answers (3)

waroa kawa
waroa kawa

Reputation: 29

I have a similar problem.. when click outside of the popup, the popup window closes automatically and change the page very fast...

I tried this code for stop close sweetalert itself, and refresh the page when the user click "OK" of sweetalert window.

HTML:

<form  method="post" action="contact.php" name="myform" onsubmit="return myFunction()">

<input type="text" class="form-control" name="full" placeholder="* Full Name" required="" >

<input type="text" class="form-control" name="last" placeholder="* Last Name" required="">

<input type="submit" value="send" name="sends" class="btn btn-lg">

</form>

javascript

<script type="text/javascript">
function myFunction() {
  var full=document.myform.full.value;
  var last=document.myform.last.value;
  if (full==null || last==null){
    swal("Error...!!!!!!");
    return false;
}else{
    swal("Congrats!", ", Your account is created!", "success");
    return true;}
}
</script>

Upvotes: 0

Jasvir
Jasvir

Reputation: 516

Note that if your button is part of a form submit, then issue 284 suggests it's not currently supported. You can change your button to a regular button (rather than a submit button) and programmatically submit the form from the callback in a sweetalert callback.

Upvotes: 1

mohamedrias
mohamedrias

Reputation: 18566

Looks like it's a form submit, So when you click the button the page refreshes.That's why you see the alert for a second and it hides.

<button class="btn btn-success" type="submit" name="submit" onclick="myFunction()">Submit</button>

You must change the button type to be button.

   <button class="btn btn-success" type="button" onclick="myFunction()">Submit</button>

Upvotes: 9

Related Questions