I'd like to close the child window when parent window is closed after showing browser's default dialog(Are you sure you want to leave?), but I couldn't find any solution to do it from parent window
why?
we can't capture the leave and cancel buttons on browser's default dialog to close the child window accordingly in beforeunload event
we can't show a custom dialog there.
Reference for what I've tried: When to close the child window when parent window is being closed in Angular
Requirement: Now I'd like to know where we can check in child window(Coffee Script) that if parent(latest Angular) is open, at regular intervals and close the child window accordingly.
So I basically would like to do something like this..
function CloseOnParentClose() {
if (typeof window.opener != 'undefined' && window.opener != null) {
if (window.opener.closed) {
window.close();
}
} else {
window.close();
}
}
$(window).ready(function() {
setInterval(CloseOnParentClose, 1000);
});
my child window code is in coffee Script and I'm new to this, I'd like to know **where to put it, it's syntax in coffee Script ** to meet the above requirement.
Thanks in Advance!
Related
In my web application, i am navigating to "EmailLetter" state to generate email letters for my clients. In this page, i have two buttons "Generate" & "Preview". "Generate" button click events works fine without any problem but "Preview" button is triggering state change error event even though it received success response from ajax service call. I am using below code snippet for "Preview" button click event
function openPreview(isValid) {
if (isValid && validateForm(true)) {
webApi.previewDocument(previewRequest)
.then(function (response) {
if (response && response.PreviewUrl) {
$window.open(response.PreviewUrl);
} else {
notification.error("Unable to generate preview!");
}
});
}
}
In the above code snippet, i am able to open preview url in a new window successfully but this statement is triggering state change error event after opening preview url in new window
$window.open(response.PreviewUrl);
Please refer to attached screen shot highlighting error event log i tracked in console window.
Please note that, my current state is showing as "abstract" and it is trying to navigate to the same state "EmailLetter". Kindly let me know if i can avoid this.
Sample plunker code here
I have Class1.cs and MainWindow.xaml and .cs.
Class1.cs looks like this
var login = htmlDoc.getElementById("login") as HTMLFormElement;
if (login != null)
{
login.submit();
}
var registerForm = htmlDoc.getElementById("register") as HTMLFormElement;
if (registerForm != null)
{
registerForm.submit();
}
In my MainWindow.cs i have a webBrowser control that loads page and waits for user. On user input i fill some input boxes and submit form. That's login.submit(). After that's executed my registerForm is always null since webBrowser control has no time to actually change content. How can i delay execution of code after login.submit and wait for page to finish loading?
You can delay the execution of code with Thread.Sleep().
However, in your case, you might want to use the WebBrowser.LoadCompleted-Event. This is an event that fires every time a page finishes loading in the webbrowser. Here's an example of how to use it.
I have a window, and inside it a panel. The panel contains text (basic html). After the window is ready I call the following function, which finds elements with specific class, and registers click events on them. This works at first.
After closing the window, and recreating 1:1 similar window the events will not fire. The same happens if I .update() the panel and re-run my function - the events fail to fire. Why is this?
I can still see elements being found, and apparently some events must be registered, but my clicks can't be captured by the debug code, or the receiving function anymore.
addEvents: function(win) {
// The Window
var ow = win;
// Using this debug trick I can see that on the second time the events wont fire
// -- nothing gets printed to console
Ext.util.Observable.capture(ow, function(){
console.log(arguments);
});
// Will search for elements, finds elements that have class myclass
// In my case the elements are just ordinary html tags in the visible content
// area of the panel.
var elems = ow.down('panel').getEl().select(".myclass").elements;
Ext.Array.forEach(elems, function (item, index, allItems) {
// We need Ext DOM element to be able to attach stuff to it
var elem = new Ext.dom.Element(item);
elem.on ('click', function (evt, el, o) {
ow.fireEvent('myevent', ow, elem);
});
});
}
I suspected at first that I have to actually unregister the previous events and destroy the window, so I tried adding this to the close of the window:
window.down('panel').destroy();
window.destroy();
However it seems I have some other problem I really am unable to understand.
This is a very JQuery-ish way to add events. You are dealing with components and should add event listeners on components. If you need to delegate events down to html elements then you need to set a single event listener on the Component encapsulating the elements and add delegate config to the actual html elements.
Here are some resources:
Explain ExtJS 4 event handling
Event delegation explained:
http://www.sencha.com/blog/event-delegation-in-sencha-touch (applies to extjs just as well)
More on Listeners with extjs: https://stackoverflow.com/a/8733338/834424
I'm using extJS 4.
I have a form pop up every time you click edit profile.
The problem is that every time you click edit Profile another form pops up so you can just keep clicking.
Is there a way to make the form only pop up if there isn't one already up.
Thanks for the help!!!
The problem sounds like you are creating a new window on every click of the "edit profile" button/link.
What you need to do is put a check in at the beginning of your form code to check to see if it exists first. If it doesn't, create the window and .show() it... Otherwise, you will just need to .show() it. Be sure to also reset the form if need be. You will also want to try and hide the window instead of destroying it. Otherwise, you will be creating new objects every time.
You can make your form modal, so to block entire interface until you close it, or you can use something like this to your controller to create form:
editProfile: function(button) {
var me = this;
if (!me.win) {
me.win = Ext.widget('editProfile');
// delete the me.win reference if the window gets destroyed
me.win.on('destroy', function() {
delete me.win;
return;
});
}
me.win.show();
}
I want to validate my extjs form. When the text field is empty, there should display an alert box and after that our cursor have to focus on the text box. I tried with the coding below. Alert is working fine. but cursor is not focusing. Can you please help me anybody to focus?
if(Ext.get('first').dom.value=='')
{
Ext.MessageBox.alert('Status', 'Enter your First Name!');
document.getElementById("first").focus();
}
The documentation states that MessageBox is asynchronous:
Note that the MessageBox is
asynchronous. Unlike a regular
JavaScript alert (which will halt
browser execution), showing a
MessageBox will not cause the code to
stop. For this reason, if you have
code that should only run after some
user feedback from the MessageBox, you
must use a callback function (see the
function parameter for show for more
details).
So, your focus() is carried out immediately after the call to Ext.MessageBox.alert, not when the user dismisses it: When the user clicks to dismiss the alert, the focus will change again.
You could try using a regular javascript alert() instead, which is synchronous.
if (Ext.get("first").dom.value == "") {
Ext.MessageBox.alert("Status", "Enter your First Name!", function() {
Ext.get("first").focus();
});
}
Try this
if(Ext.get('first').dom.value=='')
{
Ext.Msg.alert('Status', 'Enter your First Name!', function(btn, text){
if (btn == 'ok'){
Ext.getCmp('first').focus(true,10);
}
});
}