How to reload a page after clicked ok using sweetalert

Question

Hello I have a code using sweetalert

swal("Good job!", "You clicked the button!", "success")

this code will pop-up a message and has a button okay, what I like to do is I want to refresh the page after I click the okay button.

Can I do that?

score 32 · Accepted Answer · edited May 28 '21 at 15:03

32

You can try this, it works for me.

swal({
       title: "Good job", 
       text: "You clicked the button!", 
       type: "success"
     },
   function(){ 
       location.reload();
   }
);

edited May 28 '21 at 15:03

Drashti Patel

55
6

answered Mar 30 '16 at 06:56

Yoshioka

804
1
7
13

score 28 · Answer 2 · answered May 14 '18 at 20:58

28

The answer from Yoshioka did not work for me, I did this and it worked perfectly:

swal({title: "Good job", text: "You clicked the button!", type: 
"success"}).then(function(){ 
   location.reload();
   }
);

answered May 14 '18 at 20:58

Leo C

281
3
3

2

Yoshioka's answer didn't work for me but Leo thanks it woking – Vinay Kumar Apr 01 '19 at 11:27

score 15 · Answer 3 · answered Oct 04 '19 at 13:09

15

Use the callback function...

Swal.fire({
  // Swal Setting's
}).then((result) => {
  // Reload the Page
  location.reload();
});

answered Oct 04 '19 at 13:09

Jan Heil

395
4
13

Rohit Dhiman · Answer 4 · 2018-12-04T06:46:56.043

5

For Sweet Alert 2, this will work.

swal("Good job!", "You clicked the button!", "success").then(function(){
    location.reload();
});

As you can see migration guide

Sweet Alert 2 uses Promise

edited Dec 04 '18 at 06:46

answered Dec 04 '18 at 06:40

Rohit Dhiman

2,691
18
33

Rohallah Hatami · Answer 5 · 2019-02-23T10:47:09.633

5

You can check confirm by this:

swal({
  title: "Good job",
  text: "You clicked the button!",
  icon: "success",
  buttons: [
    'NO',
    'YES'
  ],
}).then(function(isConfirm) {
  if (isConfirm) {
    location.reload();
  } else {
    //if no clicked => do something else
  }
});

edited Feb 23 '19 at 10:47

answered Feb 19 '19 at 11:01

Rohallah Hatami

525
6
12

score 5 · Answer 6 · edited Oct 04 '19 at 12:10

5

I use sweet alert 2 and this works for me

swal("Good job!", "You clicked the button!","success").then( () => {
    location.href = 'somepage.html'
})

‘’’ The answers making use of location.reload() is going to trigger your form to attempt to resubmit over and over again, thats why you should use location.href instead.

edited Oct 04 '19 at 12:10

DevCisse

130
2
7

answered Feb 22 '19 at 22:57

Kingston Fortune

905
8
17

score 2 · Answer 7 · answered Oct 04 '19 at 13:05

In Sweet Alert 2, there is callback function where you can implement your logic :

Swal.fire({
  title: 'Great job',
  text: "You clicked the button!",
  type: 'success',
  showCancelButton: true,
  confirmButtonColor: '#3085d6',
  cancelButtonColor: '#d33',
  confirmButtonText: 'Yes'
}).then((result) => {
   if(result){
     // Do Stuff here for success
     location.reload();
   }else{
    // something other stuff
   }

})

score 1 · Answer 8 · edited Mar 01 '21 at 06:10

You can find the reference on SweetAlert2.

Swal.fire(
    {
        title: "Good job", 
        text: "You clicked the button!", 
        type: "success",
        showDenyButton: true,          // In case you want two scenarios 
        denyButtonText: 'ABC',
        showCancelButton: true,        // In case you want two scenarios 
        cancelButtonText:'XYZ'
    }
).then(function (result) {
    if (result.isConfirmed) {
        //You can add code here if user pressed ok button
    } else if (result.isDenied) {
        //You can add code here if user pressed deny button
    } else if(result.isDismissed) {
        //You can add code here if user pressed cancel button
    }
)

score 1 · Answer 9 · edited Jan 14 '22 at 10:43

1

this worked for me.

Swal.fire('Deleted !!', data.message, 'success').then(() => {
    location.reload();
});

edited Jan 14 '22 at 10:43

Elikill58

4,050
24
23
45

answered Jan 14 '22 at 09:33

Abdulrahim

11
1

This should be accepted answer. In Sweetalert2 it works like a charm. – Ajay Kumar Dec 08 '22 at 11:18

score 0 · Answer 10 · answered Oct 07 '20 at 09:39

0

swal({
   title: "Process Completed",
   text: "Data Recorded successfully",
   buttons: true
}).then(function(){
   location.reload();
});

answered Oct 07 '20 at 09:39

Iresha Amarasinghe

87
1
7

Ripon Uddin · Answer 11 · 2021-03-01T17:33:37.637

0

i solved it with this :

swal({title: "Updated!", text: "yourText", type: "success"},function() {
                                location.reload();
     }) // swal end

Another way :

swal("Updated!","yourText","success",function() {
     location.reload();
}) // swal end

edited Mar 01 '21 at 17:33

answered Feb 27 '21 at 18:03

Ripon Uddin

709
3
14
29

This is very similar to comments above – Fil Mar 01 '21 at 06:11
i tried from here too. i solved it that way. After that, i thought I should share the way too @Fil – Ripon Uddin Mar 01 '21 at 17:33

How to reload a page after clicked ok using sweetalert

11 Answers11