I am trying to block the back button in certain cases.
However as soon as I add the eventlistener it always blocks the back button.
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
document.addEventListener("backbutton", onBackKey, false);
}
function onBackKey() {
if($scope.quicksetup)
{
alert("1");
return false;
}
else
{
alert("2");
return true;
}
}
It comes in the else structure but when it returns true it doesn't execute the back action anymore.
There are no errors whatsoever in logcat.
I have no idea what is causing this...
Once you set the listener you overwrite the backbutton behaviour no matter if you return true or false it will not execute the normal way anymore.
You need to use navigator.app.backHistory() and navigator.app.exitApp(); to handle going back and exiting the app.
The onbackbutton callback does not expect anything to be returned, it is not a boolean callback function.
function onBackKey() {
if($scope.quicksetup)
{
alert("1");
return;
}
else
{
alert("2");
navigator.app.exitApp(); //I guess you want to exit the app here
}
}
Related
I have created functions that call other functions like
function abc()
{
def();
}
function def()
{
xyz();
}
Lets say def() is called and at any moment I have a button
<button>STOP</button>
if I press it the execution terminates that means if the execution is run again it should run again from start.
I have seen other solutions in SO but they show how to pause a loop. Can anyone help me out?
You could use a variable to determine whether your code runs or terminates:
var abort = false;
function abc()
{
if (abort) {
return;
}
def();
}
function def()
{
if (abort) {
return;
}
xyz();
}
<button onclick="abort = true">STOP</button>
The only thing you'd have to add is to reset abort back to false whenever you're triggering the main functionality.
I want a js function executed once in my code.Either in resize or load handler
.I have a function which is executed if one statement is true and another in the window resize.So when my statement is true then the function is executed and i do not want the function executed again if the window is resized.
My js codes are
if(vertical){
vertical();
}
And
$(window).resize(function(){
vertical();
}
And
var vertical = function(){
..........
}
i also prevent execution if window is resized multiple times
You have to use some kind of flags for that:
var flag = false;
function vertical() {
if (!flag) {
flag = true;
// do your job
}
}
You could solve this via a semaphore.
So you set a flag to false and before you call the function you only want to call once check if(flag) , execute the code and set flag to true
Add a variable to check if the function is fired
var execute = true;
if(vertical){
if (execute) {
vertical();
execute = false;
}
}
$(window).resize(function(){
if (execute) {
vertical();
execute = false;
}
}
Just use unbind function at the end of vertical() function so when it will execute at first it will unbind the event for next window resize.
I'm looking for something for a couple days but I didn't succeed yet.
I've got a JS function call when I press button.
This function is used for set a part of webpage in fullscreen with HMTL5.
function fullScreenCustom(element, tab) {
var pere = element.parentNode.parentNode.parentNode.parentNode;
if (pere.requestFullscreen) {
pere.requestFullscreen();
}
else if (pere.msRequestFullscreen) {
pere.msRequestFullscreen();
}
else if (pere.mozRequestFullScreen) {
pere.mozRequestFullScreen();
}
else if (pere.webkitRequestFullscreen) {
pere.webkitRequestFullscreen();
} else {
console.log("Fullscreen API is not supported");
return;
}
getElementByClass(element.parentNode, "validation").click();
}
Last line press an other button for redraw a chart.
The problem is on Chrome, click() is call before end of fullScreen.
How can I wait for fullScreen end?
You should listen for fullscreenchange event (add prefixes as necessary):
document.addEventListener("fullscreenchange", function () {
if (!document.fullscreenEnabled) {
// user has quit fullscreen
}
});
I have an app which invokes a WebService (callPathsToMultiTiffWS) which have two possibilities:
complete = true
complete = false
in the case complete = false I want to show a dialog which notifies to user than webService failed and two buttons:
retry action (reinvoke WS)
Exit
this is my code so far:
callPathsToMultiTiffWS(UID_KEY[9], stringCapturePaths, UID_KEY[1], UID_KEY[2], UID_KEY[3], UID_KEY[4], UID_KEY[5], UID_KEY[6]).then(
function (complete) {
if (complete == true) {//if true, it stores the id of the picture to delete
Windows.UI.Popups.MessageDialog("WS executed successfully", "Info").showAsync().then(function (complete) {window.close();});
} else {
var messageDialogPopup = new Windows.UI.Popups.MessageDialog("An error occur while calling WS, retry??", "Info");
messageDialogPopup.commands.append(new Windows.UI.Popups.UICommand('Retry', function () { /*code for recall element*/ }));
messageDialogPopup.commands.append(new Windows.UI.Popups.UICommand('Exit', function () { /*code for exit*/ }));
messageDialogPopup.showAsync();
_divInput.innerHTML = "";
}
},
function (error) { console.log("function error"); });
This works good so far, but I want the recall feature working
so I thought to embedd my code inside a loop like this
var ban = true;
while (true) {
callPathsToMultiTiffWS(UID_KEY[9], stringCapturePaths, UID_KEY[1], UID_KEY[2], UID_KEY[3], UID_KEY[4], UID_KEY[5], UID_KEY[6]).then(
function (complete) {
if (complete == true) {//if true, it stores the id of the picture to delete
Windows.UI.Popups.MessageDialog("WS executed successfully", "Info").showAsync().then(function (complete) { window.close(); });
} else {
var messageDialogPopup = new Windows.UI.Popups.MessageDialog("An error occur while calling WS, retry??", "Info");
messageDialogPopup.commands.append(new Windows.UI.Popups.UICommand('Retry', function () { ban == true; }));
messageDialogPopup.commands.append(new Windows.UI.Popups.UICommand('Exit', function () { ban == false; }));
messageDialogPopup.showAsync().then(function (complete) {
console.log("no ps no");
});
}
},
function (error) { console.log("function error"); });
if (ban == false) break;
}
this loop executes the webService, but it doesn't wait for user interaction to trigger the webservice by touching one of the buttons, it is an endless loop with calls to my webService, how to fix this??
thanks in advance for the support
If I'm not missing something, it looks like the error is caused because your code isn't designed to run the next set of tasks after the asynchronous call to showAsync returns. Because the call to showAsync is non-blocking, the while loop will start over again and make another call to the Web service. And because THAT call (callPathsToMultiTiffWS) is also non-blocking, the loop will start over again, triggering another call to callPathsToMultiTiffWS. And over again, and again.
My recommendation is to break out the next call to the Web service so that it will only be triggered when the user makes a selection. If you separate your concerns (move the calls to the Web service into different function or module than the UI that informs the user of an issue), then you can probably fix this.
Kraig BrockSchmidt has a great blog post about the finer details of Promises:
http://blogs.msdn.com/b/windowsappdev/archive/2013/06/11/all-about-promises-for-windows-store-apps-written-in-javascript.aspx
-edit-
Here's some code that I wrote to try to demonstrate how you might accomplish what you're trying:
function tryWebServiceCall(/* args */) {
var url = "some Web service URL";
return new WinJS.xhr({ url: url }).then(
function (complete) {
if (complete) {
return new Windows.UI.Popups.MessageDialog("WS executed successfully", "Info").showAsync().then(
function () { /*do something */ });
} else {
var messageDialogPopup = new Windows.UI.Popups.MessageDialog("An error occur while calling WS, retry??", "Info");
messageDialogPopup.commands.append(new Windows.UI.Popups.UICommand('Retry', function () {
return tryWebServiceCall( /* args */);
}));
messageDialogPopup.commands.append(new Windows.UI.Popups.UICommand('Exit', function () { return; }));
return messageDialogPopup.showAsync();
}
});
}
I am having some trouble with the on before unload and the unload method. I thought i set the code right in terms of the onload method only firing up after the confirm method for onbeforeunload was set a true. but sadly that isn't the case, what is happening is the unload method is starting even if the onbeforeunload method is set to false and the person wants to stay at the website. Here is the code I am working on it has changed a lot since I started hope its okay. I am sure it isn't since its not working the way I want it to.
var validNavigation = false;
function wireUpEvents() {
var leave_message = 'Leaving the page ?';
jQuery(function goodbye() {
jQuery(window).bind('onbeforeunload', function() {
setTimeout(function() {
setTimeout(function() {
jQuery(document.body).css('background-color', 'red');
}, 10000);
},1);
return leave_message;
});
});
function leave() {
if(!validNavigation) {
killSession();
}
}
//set event handlers for the onbeforeunload and onunloan events
window.onbeforeunload = goodbye;
window.onunload=leave;
}
// Wire up the events as soon as the DOM tree is ready
jQuery(document).ready(function () {
wireUpEvents();
});
onbeforeunload does not work like you think it does. You can return a string from the handler, which will prompt a messsage, or undefined which will do nothing.
window.onbeforeunload = goodbye;
function goodbye(e) {
if (!validNavigation) {
return leave_message;
} else {
return undefined;
}
}
Related: Way to know if user clicked Cancel on a Javascript onbeforeunload Dialog?