So I am using swal to display loading gif image and to display success/error message...
here is my code
function spinner() {
swal({
title: "<?=__('Please wait...')?>",
imageUrl: "../img/loader.gif",
showConfirmButton: false
})
}
$(document).ajaxStart(function(){
//show spinner
spinner();
}).ajaxStop(function(){
//hide spinner
swal.close();
});
So I am using this call only during ajax call is in progress, after I want to call spinner and open another swal pop-up.
.
.
.
function(data, textStatus, jqXHR)
{
//Success
$("#report-container-stand").modal( 'toggle' );
swal("<?= __('Success!') ?>", "<?= __('Message has been successfully sent to your customer support') ?>", "success")
// console.log('success');
}
.
.
.
And this doesnt because after ajax call is done he closes spinner and the next one without clicking on confirmation button....
Does anybody know what is problem?
Related
I have a project that reads and writes NFC tags in android and ios platforms.Both read and write are used inside one function.But I'm having a problem when I click the "Cancel" button on NFC prompt.
The first time the prompt shows up okay. After I click "Cancel" and try to write NFC tag again it says "You can only issue one request at a time" and after that it says "no reference available". These errors are shown as alert messages.
After removing these alerts and try again to write nfc tag the NFC popup is displayed perfectly.
So basically when clicking the button to read/write NFC tag the first time it works, the second time it doesn’t work (shows the errors) and the third time it still works.
The code:
const writeNdef = async function (profileToken) {
if (Platform.OS !== 'ios') {
promptRef.current.setVisible(true); // the android nfc popup
}
NfcManager.start();
try {
await NfcManager.requestTechnology(NfcTech.Ndef);
// the resolved tag object will contain `ndefMessage` property
const tag = await NfcManager.getTag();
getSerialNumber(tag.id);
if (isOwnedNfc === true) {
const profileUrl = “my url here”;
const bytes = Ndef.encodeMessage([Ndef.uriRecord(profileUrl)]);
await NfcManager.ndefHandler.writeNdefMessage(bytes);
setIsOwnedNfc(false);
if (Platform.OS !== 'ios'){
promptRef.current.setVisible(false);
}
Alert.alert (
"",
"Success",
[{ text: "OK" }]
);
}
} catch (ex) {
if (Platform.OS !== 'ios') {
promptRef.current.setVisible(false);
}
Alert.alert (
"",
ex.message.toString(),
[{ text: "OK" }]
);
} finally {
NfcManager.cancelTechnologyRequest();
if (Platform.OS !== 'ios') {
promptRef.current.setVisible(false);
}
}
}
I was expecting the NfcManager.cancelTechnologyRequest() to stop the first NfcManager request. I'm guessing that the 'Cancel' button doesn't cancel the request.
When close a tab or browser, you need to send the data in the form to Vue. It is made through mounted or created and window.addEventListener("beforeunload", this.unload).
Sending failed. When I tried to check the availability of the function, I got "undefined"
mounted() {
window.addEventListener("beforeunload", this.unload);
}
methods: {
unload () {
console.log("START UNLOAD FUNC");
console.log('start sync');
this.test;
console.log('finish sync');
},
test() {
console.log("START TEST");
},
}
I get the following in the log:
[1006/114208.084:INFO:CONSOLE(1)] "START UNLOAD FUNC"
[1006/114208.084:INFO:CONSOLE(1)] "start sync"
[1006/114208.084:INFO:CONSOLE(1)] "finish sync"
How can data be sent when the browser is closed?
let body = this.body;
let headers = {
type: 'application/json'
};
let blob = new Blob([JSON.stringify(body)], headers);
navigator.sendBeacon('http://127.0.0.1:8000/form/', blob);
This work for me
I'm facing a problem on Event Bus. Not sure what problem it can be.
On Login(Component) Success:
LogIn(){
Log.Success().then( user => {
this.$router.replace('/')
this.$eventBus.$emit('Sux');
}, error => {
//Error
});
},
If Login Successful, User will be redirected to Home Page
On Homepage I am listening to Event:
data(){
return{
this.LogSuccess = false,
}
}
created(){
this.$eventBus.$on('Sux', () => {
this.LogSuccess = true
alert(this.LogSuccess)
console.log(this.LogSuccess)
})
In console.log I'm seeing the true which is totally fine but data is not displaying
I'm expecting that LogSuccess becomes true and show data that is displayed only if LogSuccess condition is true.
But unfortunately it's not showing.
I'm trying to display Success message on Snackbar once the user signed in successfully.
Any help would be much appreciated
Try listening to event bus in mounted lifecycle event.
I'm new to Durandal, so I might be taking the wrong approach to my problem.
I want to show a modal popup with a message of 'logging in...please wait' when the user has clicked the login button. I want to close the modal popup once the response is received. My attempted approach is to call a custom modal popup using Durandal's app.showModal and a view with no buttons, from the login view model. This shows the modal popup I'm after, but I haven't been able to figure out how to close the popup once the server response is received. All the examples I've seen have a button on the modal popup view that closes the popup.
Is this possible? If not, is there a better approach that will show the user something is happening and also stop the user from trying to use any other button on the view?
Here's the view model code for the login view (with extraneous code removed):
define(['services/appsecurity', 'durandal/plugins/router', 'services/utils', 'services/errorhandler', 'durandal/app', 'viewmodels/controls/activityindicator'],
function (appsecurity, router, utils, errorhandler, app, activityIndicator) {
var username = ko.observable().extend({ required: true }),
password = ko.observable().extend({ required: true, minLength: 6 }),
rememberMe = ko.observable(),
returnUrl = ko.observable(),
isRedirect = ko.observable(false),
var viewmodel = {
username: username,
password: password,
rememberMe: rememberMe,
returnUrl: returnUrl,
isRedirect: isRedirect,
appsecurity: appsecurity,
login: function() {
var credential = new appsecurity.credential(this.username(), this.password(), this.rememberMe() || false),
self = this;
activityIndicator.message = 'Logging in...please wait';
app.showModal(activityIndicator);
appsecurity.login(credential, self.returnUrl())
.fail(self.handlevalidationerrors)
.always(function() { activityIndicator.close(); });
}};
return viewmodel;
});
The appsecurity.login function is the ajax post call. The view model for the custom modal is:
define(function () {
var activityIndicator = function (message, title, options) {
this.message = message;
this.title = title || activityIndicator.defaultTitle;
this.options = options || activityIndicator.defaultOptions;
this.close = function() {
this.modal.close();
};
};
return activityIndicator;
});
When running this, I get an error on .always(function() { activityIndicator.close(); }); of close is undefined.
Note for anyone using Durandal 2.0, the above marked answer only works in earlier 1.x versions. Happy coding!
Found the problem. The viewmodel for the custom modal was wrong, so the close() method was undefined. The working viewmodel is:
define(function () {
var message = ko.observable();
var activityIndicator = {
message: message,
close: function() {
this.modal.close();
}
};
return activityIndicator;
});
I have a div (mvc4 razor):
<div onclick='dialogtrigger(this)'>send</div>
when user click on this div it goes to loading a view on popup dialog box and show it to user.
it works fine for the first time that user click it, after that when user close dialog box and want to reopen it again it gives me this error :
0x800a01b6 - JavaScript runtime error: Object doesn't
support property or method 'dialog'
I clean my browser cache and check my script file if it can not support dialog why works for the first time?
my function code:
$.ajax({
url: "OpenSendDialog",
type: "GET",
})
.done(function (result) {
$("#clientdetailmodal").html(result).dialog({
autoOpen: true, modal: true, show: {
effect: "blind",
duration: 500
}
});
});
}
in my main view:
<div id="clientdetailmodal"></div>
and my controller:
[HttpGet]
public ActionResult OpenSendDialog()
{
return view();
}
I think that a problem with your function and her scope...
look here, i hope that'll help you :
var dialogtrigger=null; // global scope
$(function() {
dialogtrigger = function (){
//replace with your ajax call
$("#clientdetailmodal").html($('#content')).dialog({
autoOpen: false, modal: true, show: {
effect: "blind",
duration: 500
}
});
}
$( "#opener" ).click(function() {
// or destruct your modal on close and re-call your ajax
$( "#clientdetailmodal" ).dialog( "open" );
});
});