This is my code. When I click the close button on the child window it will display suresh on the screen but if I call popuponclick() function at the time itself suresh is getting displayed. What I do??
popuponclick = function() {
window.ChildWindow = window.open('GOLF12/shared/launchpage.html',
'popupWindow',
'width=700,height=700');
window.ChildWindow.attachEvent("onunload", OnChildWindowClose());
}
OnChildWindowClose = function() {
document.getElementById("my").innerHTML = "suresh";
window.ChildWindow = null;
};
This will likely work better on your server
It does not run if there is a popup blocker, then you will need to test if ChildWindow was opened correctly
this fiddle works, but stacksnippets fail on the popup blocking
var ChildWindow;
function popuponclick() {
ChildWindow = window.open('GOLF12/shared/launchpage.html',
'popupWindow',
'width=700,height=700');
setTimeout(function() { // we need to have the new page active
ChildWindow.addEventListener("unload",OnChildWindowClose)
},100)
}
function OnChildWindowClose() {
this.opener.document.getElementById("my").innerHTML = "suresh";
this.opener.ChildWindow = null;
};
<button onclick="popuponclick()">Click</button>
<span id="my"></span>
How can I do this with MaterializeCSS?
If a user changed something in the modal and is trying to close it (by clicking outside, Esc button, or close button on modal), I want to confirm that action.
The complete option of the modal constructor only runs after the modal is closed.
This is how I catch the user changing the modal data:
var form_changed = false;
$('.modal').find('input, textarea, checkbox').on('change', function() {
form_changed = true;
});
That doesn't seem possible out-of-the-box.
After peeking at the source code, I came up with this:
function addCloseHandler($modal, handler) {
var modal = $modal[0].M_Modal;
modal._close = modal.close;
modal.close = function () { handler(function () { modal._close(); }); };
}
Usage:
// $('.modal').modal();
addCloseHandler($('.modal'), function (close) {
form_changed ? confirm('Confirm?') && close() : close();
});
I'm currently working on a web-app in which a window is there, within which, on clicking a button a new window is created using "window.showModalDialog" function. On new window there is a link, on clicking a link a new window is created using "window.showModalDialog".
Now, the requirement is, on timeout in the child window, i want to close these windows that was created.
I tried using Window.close() function within the setTimeOut function but it only closes the top most window. please help me on this issue. Jquery solution is also welcome.
var sessionTimeout = 2;
var warningTime = 0;
var thisWarningTimer = null;
var TimeOutTimer = "";
var sDisconnectURL = "SMTime";
function startTimeoutTimer()
{
sFlag="Y";
thisWarningTimer = setInterval("popupAsk()", (sessionTimeout) * 60000);
refreshSession();
}
function refreshSession()
{
warningTime = 1;
ClearTimer();
}
function startTimeOut()
{
var TimeOutTimer = setInterval("popupAsk()", (sessionTimeout) * 60000);
}
function ClearTimer()
{
clearInterval(TimeOutTimer);
startTimeOut();
}
function popupAsk()
{
alert("Session Timeout");
location.href="SMTime/Disconnect.jsp";
}
I am trying to prevent duplicated data to database when the user click the submit button multiple times within a very short time (eg double click speed). First I disable the button after one click, then enable the button again after 3 seconds. I don't know why setTimeout("this.disabled=false",3000); is not working on jquery. Please help me out, below is my codes :
$(function() {
$(".btnSendResp").click(function() {
this.disabled = true;
setTimeout("this.disabled=false",3000);
postinResp();
});
});
You have the wrong this.
You need to save a reference to this in a local variable, then pass a function to setTimeout that uses the variable.
For example:
var self = this;
setTimeout(function() {
self.disabled = false;
}, 3000);
$(function() {
$(".btnSendResp").click(function() {
var that = this;
that.disabled = true;
setTimeout(function(){
that.disabled=false;
},3000);
postinResp();
});
});
I have an element on my page that I need to attach onclick and ondblclick event handlers to. When a single click happens, it should do something different than a double-click. When I first started trying to make this work, my head started spinning. Obviously, onclick will always fire when you double-click. So I tried using a timeout-based structure like this...
window.onload = function() {
var timer;
var el = document.getElementById('testButton');
el.onclick = function() {
timer = setTimeout(function() { alert('Single'); }, 150);
}
el.ondblclick = function() {
clearTimeout(timer);
alert('Double');
}
}
But I got inconsistent results (using IE8). It would work properly alot of times, but sometimes I would get the "Single" alert two times.
Has anybody done this before? Is there a more effective way?
Like Matt, I had a much better experience when I increased the timeout value slightly. Also, to mitigate the problem of single click firing twice (which I was unable to reproduce with the higher timer anyway), I added a line to the single click handler:
el.onclick = function() {
if (timer) clearTimeout(timer);
timer = setTimeout(function() { alert('Single'); }, 250);
}
This way, if click is already set to fire, it will clear itself to avoid duplicate 'Single' alerts.
If you're getting 2 alerts, it would seem your threshold for detecing a double click is too small. Try increasing 150 to 300ms.
Also - I'm not sure that you are guaranteed the order in which click and dblclick are fired. So, when your dblclick gets fired, it clears out the first click event, but if it fires before the second 'click' event, this second event will still fire on its own, and you'll end up with both a double click event firing and a single click event firing.
I see two possible solutions to this potential problem:
1) Set another timeout for actually firing the double-click event. Mark in your code that the double click event is about to fire. Then, when the 2nd 'single click' event fires, it can check on this state, and say "oops, dbl click pending, so I'll do nothing"
2) The second option is to swap your target functions out based on click events. It might look something like this:
window.onload = function() {
var timer;
var el = document.getElementById('testButton');
var firing = false;
var singleClick = function(){
alert('Single');
};
var doubleClick = function(){
alert('Double');
};
var firingFunc = singleClick;
el.onclick = function() {
// Detect the 2nd single click event, so we can stop it
if(firing)
return;
firing = true;
timer = setTimeout(function() {
firingFunc();
// Always revert back to singleClick firing function
firingFunc = singleClick;
firing = false;
}, 150);
}
el.ondblclick = function() {
firingFunc = doubleClick;
// Now, when the original timeout of your single click finishes,
// firingFunc will be pointing to your doubleClick handler
}
}
Basically what is happening here is you let the original timeout you set continue. It will always call firingFunc(); The only thing that changes is what firingFunc() is actually pointing to. Once the double click is detected, it sets it to doubleClick. And then we always revert back to singleClick once the timeout expires.
We also have a "firing" variable in there so we know to intercept the 2nd single click event.
Another alternative is to ignore dblclick events entirely, and just detect it with the single clicks and the timer:
window.onload = function() {
var timer;
var el = document.getElementById('testButton');
var firing = false;
var singleClick = function(){
alert('Single');
};
var doubleClick = function(){
alert('Double');
};
var firingFunc = singleClick;
el.onclick = function() {
// Detect the 2nd single click event, so we can set it to doubleClick
if(firing){
firingFunc = doubleClick;
return;
}
firing = true;
timer = setTimeout(function() {
firingFunc();
// Always revert back to singleClick firing function
firingFunc = singleClick;
firing = false;
}, 150);
}
}
This is untested :)
Simple:
obj.onclick=function(e){
if(obj.timerID){
clearTimeout(obj.timerID);
obj.timerID=null;
console.log("double")
}
else{
obj.timerID=setTimeout(function(){
obj.timerID=null;
console.log("single")
},250)}
}//onclick
Small fix
if(typeof dbtimer != "undefined"){
dbclearTimeout(timer);
timer = undefined;
//double click
}else{
dbtimer = setTimeout(function() {
dbtimer = undefined;
//single click
}, 250);
}
, cellclick :
function(){
setTimeout(function(){
if (this.dblclickchk) return;
setTimeout(function(){
click event......
},100);
},500);
}
, celldblclick :
function(){
setTimeout(function(){
this.dblclickchk = true;
setTimeout(function(){
dblclick event.....
},100);
setTimeout(function(){
this.dblclickchk = false;
},3000);
},1);
}
I found by accident that this works (it's a case with Bing Maps):
pushpin.clickTimer = -1;
Microsoft.Maps.Events.addHandler(pushpin, 'click', (pushpin) {
return function () {
if (pushpin.clickTimer == -1) {
pushpin.clickTimer = setTimeout((function (pushpin) {
return function () {
alert('Single Clic!');
pushpin.clickTimer = -1;
// single click handle code here
}
}(pushpin)), 300);
}
}
}(pushpin)));
Microsoft.Maps.Events.addHandler(pushpin, 'dblclick', (function (pushpin) {
return function () {
alert('Double Click!');
clearTimeout(pushpin.clickTimer);
pushpin.clickTimer = -1;
// double click handle here
}
}(pushpin)));
It looks like the click event masks the dblclick event, and this usage is clearing it when we add a timeout. So, hopefully, this will work also with non Bing Maps cases, after a slight adaptation, but I didn't try it.