jQuery function not invoked from window variable - javascript

I need to show a primefaces dialog when my applet is closed, because there is a thread doing some stuff once it's finished i would like to hide the dialog from the page.
In order to do this i have used the liveConnect using netscape.javascript.JSObject.
this is working like a charm everything is alright.
The problem is the javascript functions are well invoked, but the dialog.show() function is not invoked.
Here is the code :
function doit1() {
$(window).ready(function() {
statusDialog.show();
});
}
;
function doit2() {
$(window).ready(function() {
statusDialog.hide();
});
};
window.callJS = function() {
console.log("we're here 1");
doit1();
console.log("its here1");
};
window.callJS1 = function() {
console.log("we're here 2");
doit2();
console.log("its here2");
};
these methods are called from the applet like this :
JSObject window = JSObject.getWindow(this);
window.call("callJS", null);
//do_some_thread_stuff();
window.call("callJS1", null);
And here is what's happening in the console :
we're here 1
its here1
we're here 2
its here2
So, what i'm really missing and what's preventing the dialog from showing.
Note : when i use chrome DevTools console to execute the doit() methods they're working fine but i get the undefined aftermath.

The problem was with threads, i was invoking JS methods before thread.start().
I've put the window.call("callJS", null); inside the thread and it's working fine.

Related

Function works when I put it in an onclick but doesn't work when I try to use in on page-load (JavaScript)

I am building a Microsoft VSTS extension using HTML JavaScript.
I need to access this function VSS.getWebContext() which gives you all information of the project page where you are currently running your extension.
let webContext = VSS.getWebContext();
let projectName = webContext.project.name + "_kpi_test"
# prints out fine
console.log('projname', projectName);
When I put this into an onclick function of a button, it works fine and prints the information that I need.
But when I just use
$(window).ready(function(){
// your code
});
and
$(document).ready(function(){
// your code
});
and
window.onload = codeAddress; //my function here
to use the VSS.getWebContext() to retrieve the information when the page loads, it keeps giving me that VSS.getWebContext() is undefined.
If it works on onClick but not on page-load, what could be the problem?
I am not sure what exactly VSS needs, but since it is working in onClick it is probably just that the page has not actually completely loaded yet in your document and window ready calls.
You could try:
$(window).bind("load", function() {
// code here
});
There is an VSS.init and VSS.ready function, see use the SDK from vss-web-extension-sdk GitHub for more information.
In Angular & TypeScript:
// VARIABLES VSS
extensionInitializationOptions: IExtensionInitializationOptions = { applyTheme: false, usePlatformScripts: false, usePlatformStyles: false };
async ngOnInit(): Promise<void> {
if (environment.production) {
// VSS INIT
VSS.init(this.extensionInitializationOptions);
// VSS READY
VSS.ready(async () => {
await this.init();
});
} else await this.init();
}
environment.production for local debugging.

Javascript TypeError is not a function issue

Run into a JavaScript issue that I can't understand. I'm making a JavaScript "class" that is supposed to draw some things on a canvas, and if the window gets resized, it's supposed to know how to resize the canvas on its own and fix orientation for the drawn objects.
Everything seems to work fine when I use this class from my own test html, but when I extracted my class into a separate .js file to be added as <script src="myclass.js"></script> for other people's usage, it starts throwing a "TypeError: this.func02 is not a function" error upon resize. This is annoying because this.func02 clearly is a function.
Also, there's a ticker constantly calling func03, and in the console I can clearly see logs being printed out periodically (those logs happen from func01, which is called by func03, in the exact same way that func02 calls it). Those logs keep working even after a TypeError showing up whenever I resize.
The JS:
function myClass() {
this.func01 = function() {
console.log("func1");
//do stuff
}
this.func02 = function() { //<- this doesn't work ???
this.func01();
//and do more stuff
}
this.func03 = function() { //<- this works ???
this.func01();
//stuff
}
window.addEventListener("resize", this.func02, false);
}
function useMe() {
objectOfMyClass = new myClass();
setInterval(tickerThatCallsFunc03ofMyClass, 50);
}
If anybody has any idea why this happens, please write stuff. I'm stumped on debugging this. I tried to remove all irrelevant code from my program, if you need more information post and I'll add it.
Note: the problem here isn't the keyword "this". Maybe it's part of the problem, but it's not all of it. The exact code works when it's in one file with the html, but doesn't work when it's added to the html with
this is inside of a function is referencing the function not the class to save a reference to the class and use that within a function:
function myClass() {
var myclass = this;
this.func01 = function() {
console.log("func1");
//do stuff
}
this.func02 = function() { //<- this doesn't work ???
myclass.func01(); //<- I get typeError on this call
//and do more stuff
}
this.func03 = function() { //<- this works ???
myclass.func01();
//stuff
}
window.addEventListener("resize", this.func02, false);
}
function useMe() {
objectOfMyClass = new myClass();
setInterval(tickerThatCallsFunc03ofMyClass, 50);
}

How to refresh the parent page on closing the rad window

I have a opened a rad window using below java-script code given below. Now I want to refresh my parent page on closing the rad window. To achieve this i have linked a jquery method, OnSendInviteClose with onclose event. Now this code refreshes my parent page but some time it gives me error described as "can't execute code from a freed script". How to fix this issue or reload my parent page on close (any other way).
Thanks
var e_showaddresslist = function (sender, args) {
var url = $page.url.create("Pages/CalendarInvites.aspx?parentScreen=sendInviteWnd");
var win = $window.createPopup(url,
{
size: "750, 500", behaviors: Telerik.Web.UI.WindowBehaviors.Close | Telerik.Web.UI.WindowBehaviors.Maximize | Telerik.Web.UI.WindowBehaviors.Move | Telerik.Web.UI.WindowBehaviors.Reload | Telerik.Web.UI.WindowBehaviors.Modal, name: "sendInviteWnd", onclose: onSendInviteClose
},
function () {
//$page.get_window().set_destroyOnClose(true);
});
}
function onSendInviteClose() {
window.location.reload(true);
}
Note: All the code is place in the calendar.js file which has references in both parent and radwindow page.
Have a read of this What causes the error "Can't execute code from a freed script"
The try / catch solution may help in your case.
You can hook the OnClientColose to the RadWindow and refresh the page using document.location.reload().
function RefreshParentPage()//function in parent page
{
document.location.reload();
}
Thanks,
Saritha
Make sure the code is executed in the correct context, i.e., in the main page and not in the CalendarInvites page.
Then, if this is ok, try adding a timeout like this:
function onSendInviteClose() {
setTimeout(function() {
window.location.reload(true);
}, 0); //you can also try increasing the timeout.
}
Usually, the cannot execute code from freed script means that the content page that is being disposed is still trying to run some code but it is orphaned (e.g., other pieces of code it depends on are disposed, or its context is gone - the window object). Most often this would be the page in the iframe (i.e., inside the RadWindow), but it may also be your main page.
Attached the 'onSendInviteClose' method on close event.
var win = $window.createPopup(url,
{
size: "750, 500", behaviors: Telerik.Web.UI.WindowBehaviors.Close |Telerik.Web.UI.WindowBehaviors.Move, onclose: onSendInviteClose
}
Now create that method in the page from which the popup is opened. This function will automatically fired when popup window is closed.
function onSendInviteClose() {
//get a reference to the current RadWindow
var wndow = GetRadWindow();
wndow .Close();
// and as this method is present in parent page
// we can refresh the page controls easily.
}
function GetRadWindow() {
var oWindow = null;
if (window.radWindow) oWindow = window.radWindow;
else if (window.frameElement.radWindow) oWindow = window.frameElement.radWindow;
return oWindow;
}

Return parent function from child function on click

How can I return a parent function from a child function on click? Here's an example code:
function returnFunction() {
var output = false;
$('a').click(function() {
output = true;
});
return output;
}
var result = returnFunction();
The result will always be false since the click hasn't happened at the time the code is being run. How could I make this work though?
My intention is to call pop-up dialogs, and I'd like to have all the logic inside one function that can easily be loaded - including the click events of a Confirm dialog box.
Elsewhere in scripts I'd be calling it this way for example:
// Menu click triggers the dialog
$('a').click(function(e) {
// The function displays the dialog and returns the click events of the dialog
var result = returnFunction();
// If result was false, we'll prevent the menu access, for example
if (!result) {
e.preventDefault();
}
});
I'm aware of the jQuery UI dialog plugin. But I'd like to achieve this without it for now.
Thanks.
An over-simplification of it is:
Everything stops (including scrolling and clicking on hyperlinks) while executing javascript. This means you cannot "pause" the script until someone clicks on a link.
The typical way of solving this is a callback function:
function my_callback(some, arguments) {
// you can do whatever in here: an ajax load, set a global variable, change some of the page, ...
console.log(some, arguments);
alert(some + " " + arguments);
}
function returnFunction(callback, param) {
var output = false;
$('a').click(function() {
callback(param, "world");
});
}
returnFunction(my_callback, "hello");
demo at http://jsfiddle.net/UnBj5/
EDIT:
I did mention global variables because they are an option, but they are typically bad style. Try to use other means if possible.
If you want more help with it, provide more details of what you are trying to do.
Try using parameters instead. Send a parameter to a function that shows your alert boxes, show a different pop-up alert depending on the parameter, what you are trying to do won't work because its basically a chicken-egg problem.

jQuery: try catch { call function } does not work?

I'm having a lot of JavaScript on my page and I'm using typekit. In order to make my page work correctly (grid and stuff) I'm using the new typekit font events.
It's simply a try and catch statement that checks if fonts get loaded or not. However somehow I'm not getting it. I'm calling the setGrid() function if typekit fonts are loaded, but e.g. iPad or iPhone doesn't support that yet and so my page doesn't get properly shown when I don't call the setGrid() function.
Anyway, I want to call the function in the error statement as well, so if the page is called on the iPhone, the page works without webfonts as well.
try {
Typekit.load({
loading: function() { },
active: function() { setGrid(); },
inactive: function() { }
})
} catch(e) {
alert('error'); //works
setGrid(); //doesn't get called
}
However, the alert works, the setGrid() function doesn't get called.
Any ideas?
edit: the function looks like that:
var setGrid = function () {
$('#header, #footer').fadeIn(500);
return $("#grid").vgrid({
easeing: "easeOutQuint",
time: 800,
delay: 60
});
};
Try making it "real" function, like this:
function setGrid() {
$('#header, #footer').fadeIn(500);
return $("#grid").vgrid({
easeing: "easeOutQuint",
time: 800,
delay: 60
});
};
The function does get called, but it just doesn't work as you expected causing you to think that it isn't getting called. You can see that it is getting called by adding an alert as the first line of setGrid.
jsfiddle link
Can you:
try/catch around setGrid, too
alert after setGrid to confirm it's getting through setGrid

Categories

Resources