I am using SweetAlert2 and I am getting the following error
Uncaught TypeError: Cannot read property 'then' of undefined
When I use the exact same code as suggested in SweetAlert page.
swal({
title: 'Are you sure?',
text: "You won't be able to revert this!",
type: 'warning',
showCancelButton: true,
confirmButtonColor: '#3085d6',
cancelButtonColor: '#d33',
confirmButtonText: 'Yes, delete it!',
cancelButtonText: 'No, cancel!',
confirmButtonClass: 'btn btn-success',
cancelButtonClass: 'btn btn-danger',
buttonsStyling: false,
closeOnConfirm: false,
closeOnCancel: false
}).then(function(isConfirm) {
if (isConfirm === true) {
swal(
'Deleted!',
'Your file has been deleted.',
'success'
);
} else if (isConfirm === false) {
swal(
'Cancelled',
'Your imaginary file is safe :)',
'error'
);
} else {
// Esc, close button or outside click
// isConfirm is undefined
}
})
I have the code at the end of the page. I am using it in a Ruby on Rails app. I have tried returning a value as suggested in other posts, but it does not fix the problem
I am using SweetAlert2 and I am getting the following error
Uncaught TypeError: Cannot read property 'then' of undefined
When I use the exact same code as suggested in SweetAlert page.
swal({
title: 'Are you sure?',
text: "You won't be able to revert this!",
type: 'warning',
showCancelButton: true,
confirmButtonColor: '#3085d6',
cancelButtonColor: '#d33',
confirmButtonText: 'Yes, delete it!',
cancelButtonText: 'No, cancel!',
confirmButtonClass: 'btn btn-success',
cancelButtonClass: 'btn btn-danger',
buttonsStyling: false,
closeOnConfirm: false,
closeOnCancel: false
}).then(function(isConfirm) {
if (isConfirm === true) {
swal(
'Deleted!',
'Your file has been deleted.',
'success'
);
} else if (isConfirm === false) {
swal(
'Cancelled',
'Your imaginary file is safe :)',
'error'
);
} else {
// Esc, close button or outside click
// isConfirm is undefined
}
})
I have the code at the end of the page. I am using it in a Ruby on Rails app. I have tried returning a value as suggested in other posts, but it does not fix the problem
Share Improve this question asked Apr 14, 2016 at 0:01 marimafmarimaf 5,4103 gold badges52 silver badges70 bronze badges 6- Did you added reference to the related js file? – Hirad Nikoo Commented Apr 14, 2016 at 0:04
- Because it means that there is not swal in the context. So it means either that the javascript file is not referenced in the file or the swal is not created properly. – Hirad Nikoo Commented Apr 14, 2016 at 0:05
- @HiradNikoo I have swal referrenced. It actually pops up the modal view. But after the confirm/cancel it doesn't go through. – marimaf Commented Apr 14, 2016 at 0:49
- Yeah it is definitely problem with Promise that OJay mentioned but please try my solution see if it works. – Hirad Nikoo Commented Apr 14, 2016 at 0:53
- Sorry I think OJay's answer is correct. Please download Promise from here github./stefanpenner/es6-promise – Hirad Nikoo Commented Apr 14, 2016 at 1:01
1 Answer
Reset to default 11looks as thought the sweetalert2 implementation uses the native promise api, and there is no included polyfill. Meaning might not work in some browsers. Even the github page shows the same error. Works fine when I try it in chrome, but does not work in IE11. I would look at including a promise API polyfill, depending on what browser/s you are trying to support. This has nothing to do with rails.
Polyfill is here or google ES6 promise polyfill. Include it before the sweetalert2 js file and you should be fine.
If don't understand what I am talking about with the promise API, good article here about it, or google JS promise.
Now if all of this is too hard, and/or confusing, why not just use the original sweetalert (link here) as it doesn't use the promise api. Not exactly sure why they forked, as I can't see any drastically new functionality, apart from using promises of course, and a couple of new modal icons (info and question)