I have buttons to execute scripts in my Sheets Addon
<button class="button-68" role="button" onclick="morphf3994()">Unir columnas con el mismo encabezado</button>
<script>
function morphf3994() {
swaload()
google.script.run
.withSuccessHandler(swalsuccess)
.withFailureHandler(swalerror)
.merge_Columns();
}
</script>
And SweetAlert shows a Executing... alert while the script is making its function.
<script>
function swaload() {
Swal.fire({
titleText: "Ejecutando...",
text: 'Por favor, no toques ni cierres el documento.',
icon: 'warning',
allowOutsideClick: false,
preConfirm: Swal.showLoading(),
showLoaderOnConfirm: true,
showConfirmButton: false,
showCancelButton: true,
})
}
</script>
The Alert has just a Cancel button, but I don't know how to implement the CancelButton to stop the button function before finishing (in this case the .merge_Columns() function. Right now the Cancel Button just close the loading window.
Thanks!
Use then function of swal in your code. Reference
<script>
function swaload() {
Swal.fire({
titleText: "Ejecutando...",
text: 'Por favor, no toques ni cierres el documento.',
icon: 'warning',
allowOutsideClick: false,
preConfirm: Swal.showLoading(),
showLoaderOnConfirm: true,
showConfirmButton: false,
showCancelButton: true,
}).then((result) => {
if (result.isConfirmed) {
return true;
} else if (result.isDenied) {
return false;
}
})
}
</script>
apply condition in morphf3994 function
<script>
function morphf3994() {
if(swaload()){
google.script.run
.withSuccessHandler(swalsuccess)
.withFailureHandler(swalerror)
.merge_Columns();
}
}
</script>
Well, with this edit the function is running, but what i need is the code to STOP the .merge_Columns from executing. The function is already running when the Cancel button appears but I don't know the apps script code to stop the function.
<script>
function morphf9566() {
if(swaload()){
}
else {
google.script.run
.withSuccessHandler(swalsuccess2)
.withFailureHandler(swalerror)
.merge_Columns();
}
}
</script>
Thanks
Related
Am I missing to add some script or what? I am getting error from title. How can I solve this, if you can help me, I would be grateful. I tried adding different scripts, but I amgetting the same error.
<a onclick="buyNft({{$nft->id}})">{{trans('nft.buy')}}</a>
#push('scripts')
<script>
function buyNft(nftid) {
swal({
title: "Are You Sure?",
text: "Do you want to buy this nft?",
type: 'warning',
showCancelButton: true,
showConfirmButton: true,
confirmButtonColor: '#3085d6',
cancelButtonColor: '#d33',
}).then((result) => {
if (result) {
axios.post("/buythisnft/" + nftid).then(response => {
window.location.reload();
});
}
});
}
</script>
#endpush
Your buyNft-function needs to be declared BEFORE you echo out any element with "onclick=buyNft()":
#push('scripts')
<script>
function buyNft(nftid) {
// ...
}
</script>
#endpush
<a onclick="buyNft({{$nft->id}})">{{trans('nft.buy')}}</a>
UPDATE: This is an example using a script at the bottom of the page which creates an eventlistener for click-events:
document.addEventListener("click",e => {
if(e.target.closest(".buyNft")){
e.preventDefault();
alert("You want to buy an NFT.")
//... Replace with your own functions ...
}
})
<a class="buyNft" href="#">Buy that NFT</a>
<br /><br />
Some other link on this page
I add some special functionality in my modal close event with sweetalert2 but I have faced some issues when I close the modal the first time the close event does not show up again when I opened.
Live Example:
https://codepen.io/themes4all/pen/oNWeYzp
Note:
to know exactly what I'm talking about trying to close the modal and
opened and closed again.
jQuery Code:
(function ($) {
"use strict";
$(window).on("load", function () {
if ($(".modal").length) {
$(".modal").modal("show");
$(".modal").on("shown.bs.modal", function (e) {
e.preventDefault();
$(".spinner")
.removeClass("d-none")
.delay(3000)
.fadeOut(500, function () {
$(this).addClass("d-none");
});
});
$(".modal").on("hide.bs.modal", function (e) {
e.preventDefault();
var swalWithBootstrapButtons = Swal.mixin({
customClass: {
confirmButton: "btn btn-primary",
cancelButton: "btn btn-danger me-3",
},
buttonsStyling: false,
});
swalWithBootstrapButtons
.fire({
title: "Are you sure?",
text: "You won't be able to revert this!",
icon: "warning",
confirmButtonText: "<i class='fas fa-check-circle me-1'></i> Yes, I am!",
cancelButtonText: "<i class='fas fa-times-circle me-1'></i> No, I'm Not",
showCancelButton: true,
reverseButtons: true,
focusConfirm: false,
})
.then((result) => {
if (result.isConfirmed) {
$(this).off("hide.bs.modal").modal("hide");
$(".modal-backdrop").remove();
$("body").removeClass("modal-open").removeAttr("style");
}
});
});
}
});
})(window.jQuery);
Remove the data-bs-dismiss attribute from the close button.
Instead of calling the method on hide, call the sweetalert on the close button click.
And on confirming the sweetalert, just do $(".modal").modal("hide")
This should work.
JSFiddle
I created a swal for a notification. To show up in the screen the result of the ajax function has to be 0. But this ajax function run every 2 seconds. Sometimes the ajax function returns more than one result has 0, so the swal dont stop showing, just showing the other when the user click in the close button. I would like to show one swal at the time, but setInterval function isnt alowing me to do it.
This is the funtion with the swal:
function montarModalLigacao(cdRamalLigacao = null)
{
var dsHtml = buscaDadosAjax('Ramal', 'obtemHtmlLigacao', {cdLigacaoRamal: cdRamalLigacao});
console.log(dsHtml);
if (dsHtml)
{
swal({
allowOutsideClick: false,
allowEnterKey: false,
showCloseButton: true,
showCancelButton: true,
title: 'Recebendo Chamada',
html: dsHtml,
cancelButtonText:'Fechar',
confirmButtonText: 'Lançar Ticket',
width: '80%'
}).then((result) => {
if (result.value)
pop_open('man_atendimento_ticket.php?f_id_retorno=70&f_cd_ticket=');
});
}
}
And here is where i call it, with the setInterval:
$(document).ready(function(){
setInterval(function(){
retorno = buscaDadosAjax('Ramal', 'verificarLigacao', {});
if (parseInt(retorno.id_capturado) === 0)
montarModalLigacao(retorno.cd_ramal_ligacao);
}, 2000);
}
Do not do it on an interval, call it when you are ready for the next one to happen.
function montarModalLigacao(cdRamalLigacao = null) {
var dsHtml = buscaDadosAjax('Ramal', 'obtemHtmlLigacao', {
cdLigacaoRamal: cdRamalLigacao
});
console.log(dsHtml);
if (dsHtml) {
swal({
allowOutsideClick: false,
allowEnterKey: false,
showCloseButton: true,
showCancelButton: true,
title: 'Recebendo Chamada',
html: dsHtml,
cancelButtonText: 'Fechar',
confirmButtonText: 'Lançar Ticket',
width: '80%'
}).then((result) => {
if (result.value)
pop_open('man_atendimento_ticket.php?f_id_retorno=70&f_cd_ticket=');
setUpCall();
});
} else {
setUpCall();
}
}
function setUpCall() {
setTimeout(function() {
retorno = buscaDadosAjax('Ramal', 'verificarLigacao', {});
if (parseInt(retorno.id_capturado) === 0)
montarModalLigacao(retorno.cd_ramal_ligacao);
}, 2000);
}
$(document).ready(setUpCall);
Sweet-alert not returning the true or false after calling this get_alert() function please suggest some suggestions how could we able to work this
function get_alert() {
$('#removeactive').on('click', function(e) {
e.preventDefault();
var message = $(this).data('confirm');
//pop up
swal({
title: "Are you sure ??",
text: message,
icon: "warning",
buttons: true,
dangerMode: true,
})
.then(function(isConfirm) {
console.log(isConfirm == true);
if (isConfirm == true) {
return true;
} else {
return false;
}
});
});
}
<button id="removeactive" data-confirm="Are you sure?" type="button">Click</button>
You should not need a function to assign an event handler. Also you have not told us when you call get_alert. Calling get_alert will NOT show the alert, only assign the handler
Here I run on load of the page
If the removeactive element is dynamic, you need to change to
$(document).on('click','#removeactive', function(e) {
or better:
$(document).on('click','.removeactive', function(e) {
so any element with that class can call the alert
You also need to remove active where you know the status of the isConfirm
Here is a working example
$(function() { // on page load
$('#removeactive').on('click', function(e) {
e.preventDefault();
var message = $(this).data('confirm');
//pop up
swal({
title: "Are you sure ??",
text: message,
icon: "warning",
buttons: true,
dangerMode: true,
})
.then(function(isConfirm) {
console.log("confirmed?", isConfirm);
if (isConfirm) console.log("deleting"); // here you delete
else console.log("cancelled"); // here you do whatever or nothing
// You cannot return anything
});
});
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/2.1.2/sweetalert.min.js"></script>
<button id="removeactive" data-confirm="This will remove the active widget from the sprocket" type="button">Click</button>
I want to show a custom confirmation message in my ASP.NET MVC application.
After some search, I found SweetAlert which is a very nice tool.
https://sweetalert2.github.io/
I want to define a javascript method in a js file which calls the sweetalert to show a dialog.
But the document doesn't wait for the respons of the client.
To demonstrate what I mean, I added the code below.
The code alert("Doesn't wait"); executes before sweetalert shows its message.
My objectif is to add a custom javascript file and define a simble function to call and return true or false to avoid typing all the code below in every confirmation case.
As it doesn't wait the client interaction, I don't know if it is possible.
Any idea ?
<html>
<head>
<script src="SweetAlert.js"></script>
</head>
<body>
<button onclick="customConfirm();">Confirm</button>
</body>
</html>
<script type="text/javascript">
function customConfirm(){
Swal.fire({
title: 'myTitle',
text: 'my Question',
type: 'question',
showCancelButton: true,
confirmButtonColor: 'rgb(181, 212, 83)',
cancelButtonColor: '#d33',
confirmButtonText: 'YES'
}).then((result) => {
if (result.value) {
return true;
}
else {
return false;
}
});
alert("doesn't wait.");
}
</script>
You should perform all checks in the callback.
function customConfirm(callback){
Swal.fire({
title: 'myTitle',
text: 'my Question',
type: 'question',
showCancelButton: true,
confirmButtonColor: 'rgb(181, 212, 83)',
cancelButtonColor: '#d33',
confirmButtonText: 'YES'
}).then((result) => {
// Do some stuff and call the callback
callback();
if (result.value) {
return true;
}
else {
return false;
}
});
In another file:
customConfirm(function() {
// Put some stuff you want to do
});
Or:
function callbackDoSomething() {}
customConfirm(callbackDoSomething);