I want to count the number of opened new windows.
But, when i close the opened newWindow ,then reduce the window count.
My new window have closelink also.
May be i choose either closelink or browser close window.
Update
If i have open 2 new window, then i calculate currently opened window.
But, if any window i close using ( close link, or browser closewindow), now only one new window is opened.
Here i don't know, how to show the opened window count is 1.
Totally 4 files are : MainPage.jsp , newwindow1.jsp , newwindow2.jsp and windowcount.js
MainPage.jsp
<f:view>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<a4j:loadScript src = "windowcount.js" />
</head>
<body>
<h:outputLink value="#" onclick="window.open('newwindow1.jsp','firstwindow','width=600,height=600');addWindowCount();">
<h:outputText value="new Window1"/>
</h:outputLink>
<h:outputLink value="#" onclick="window.open('newwindow2.jsp','secondWindow','width=600,height=600');addWindowCount();">
<h:outputText value="New window 2"/>
</h:outputLink>
<a4j:commandButton value="Get Window Count" onclick="getNewWindowCount();"/>
</body>
</html>
newwindow1.jsp
<f:view>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>First Window</title>
</head>
<body>
<a4j:commandLink id="firstWindowCloseLinkId"
value="Close Window"
onclick="javascript:window.close()"/>
</body>
</html>
newwindow2.jsp
<f:view>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Second Window</title>
</head>
<body>
<a4j:commandLink id="secondWindowCloseLinkId"
value="Close Window"
onclick="javascript:window.close()"/>
</body>
</html>
windowcount.js
var countNewWindow = 0;
function addWindowCount()
{
countNewWindow++;
}
function getNewWindowCount()
{
alert("Current opened NewWindow : " + countNewWindow);
}
Help me about this.
Thanks for your effort.
You can't.
JavaScript doesn't have access to other open windows, unless they were opened using window.open().
Just i add one more button and javscript. But i can't get the openedPopup window count.
MainPage.jsp
<a4j:commandButton value="PopupCount" onclick="countOpenPopups();"/>
And javaScript is :
function countOpenPopups()
{
var iCount = 0;
for (var i = 0; i < eWebEditPro.popups.length; i++)
{
if (eWebEditPro.popups[i].isOpen())
{
iCount++;
}
}
alert("iCount : " +iCount);
}
I refer this.
http://dev.ektron.com/kb_article.aspx?id=568
I think this script related to eWebEditPro.
Is possible to implement to normal browser link(FireFox,IE etc...)
Related
New tab works good, but for some reasons current page haven't redirect (window.location from changeLocation() doesn't work)
function changeLocation() call success everytime when I click button, but location doesn't change.
Basically it seems like window.location doesn't work because of form submit (although I use target="_blank"). But if I add return false after window.location to function, I'm not able to submit form after changing location (because I'm already on another page) and also submit before changing location impossible.
Is this possible to make it works somehow? Thanks.
function changeLocation (){
window.location = "http://bing.com";
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>EXAMPLE</title>
</head>
<body>
<form action="https://google.com" target="_blank">
<input type="text">
<button onclick="changeLocation()">Submit</button>
</form>
</body>
</html>
This code works for firefox
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>EXAMPLE</title>
<script type="text/javascript">
function changeLocation (){
window.location = "http://bing.com";
}
</script>
</head>
<body>
<form action="https://google.com" target="_blank">
<input type="text">
<button onclick="changeLocation()">Submit</button>
</form>
</body>
</html>
google.com is being loaded in the new tab and the current tab us being loaded with bing.com
To solve it, you need to add setTimeout to function like this.
function changeLocation (){
setTimeout(function(){
window.location = "http://bing.com";
},200);
}
No ideas why, but it works perfect.
Dim returnUrl = Request.UrlReferrer.ToString()
Response.Write("<script> setTimeout(function(){window.location = """ + returnUrl + """;},200);window.open (""" + loginurl + """,'_blank');</script>")
Just beginning to learn HTML & Javascript.
I have the following code, which works. however, because I have have an img tag in my body it is trying to show a place holder for an image before I click the button. How can I stop this.
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Tesco JSONP</title>
<script type="text/javascript">
function picture(){
var pic = "http://img.tesco.com/Groceries/pi/118/5000175411118/IDShot_90x90.jpg"
document.getElementById('bigpic').src = pic.replace('90x90', '225x225');
}
</script>
</head>
<body>
<img id="bigpic" src="bigpic" />
<button onclick="picture()">Enlarge</button>
</body>
</html>
Best wishes.
Add style "display:none" to picture tag
<img id="bigpic" src="bigpic" style="display:none;"/>
And in function picture change it for show image
document.getElementById('bigpic').style.display='block';
There is demo: http://jsfiddle.net/eX5kx/
Use display property in css, try this:
javascript:
function showPicture() {
var sourceOfPicture = "http://img.tesco.com/Groceries/pi/118/5000175411118/IDShot_90x90.jpg";
var img = document.getElementById('bigpic')
img.src = sourceOfPicture.replace('90x90', '225x225');
img.style.display = "block";
}
html:
<img style="display:none;" id="bigpic" src="bigpic" />
<button onclick="showPicture()">Enlarge</button>
I like shin solution, i would do the same thing myself. However theres a lot of way to do that, another option is to put a tiny trasparent image as default and then replace like you did to the other one. like this:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Tesco JSONP</title>
<script type="text/javascript">
function picture(){
var pic = "http://img.tesco.com/Groceries/pi/118/5000175411118/IDShot_90x90.jpg"
document.getElementById('bigpic').src = pic.replace('90x90', '225x225');
}
</script>
</head>
<body>
// tiny trasparent image
<img id="bigpic" src="https://maps.gstatic.com/mapfiles/markers2/dd-via-transparent.png" alt="" />
<button onclick="picture()">Enlarge</button>
</body>
</html>
this way no css is needed but like i said before i prefer Shin's solution.
If I have some hidden element on a page, that contains some content, how can I create a link and when user clicks it, browser would open a new window and show the content (only the content, for example some json data)?
ps. I know that's probably bad idea to have some hidden content on the page. It's better to put an action link that will get the content from the server.. But it involves many other headaches and it wasn't me who created the page, so please just let me know if there's a comparatively easy solution...
Please use http://okonet.ru/projects/modalbox/index.html with inline content setting
You could pass the (URL encoded) contents of the hidden element as an argument in the URL when opening the second page. That argument could then be (unencoded and) inserted into the body of the second page when it loads.
The following example works locally on OS X. On other operating systems, the example may need to be placed on an actual web server before it will work:
page1.html:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Page 1</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
function openwindow(){
window.open("page2.html?html="+escape($("#myDiv").html()));
}
</script>
<style>
.hidden {
visibility: hidden;
}
</style>
</head>
<body>
Click Me!
<div class="hidden" id="myDiv">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/6/6e/HTML5-logo.svg/200px-HTML5-logo.svg.png">
<p>See the HTML5 specification</p>
</div>
</body>
</html>
page2.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Page 2</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
jQuery.extend({
// from: http://paulgueller.com/2011/04/26/parse-the-querystring-with-jquery/
parseQuerystring: function(){
var nvpair = {};
var qs = window.location.search.replace('?', '');
var pairs = qs.split('&');
$.each(pairs, function(i, v){
var pair = v.split('=');
nvpair[pair[0]] = pair[1];
});
return nvpair;
}
});
</script>
<script>
$(document).ready(function(){
$(document.body).html(unescape(jQuery.parseQuerystring().html));
});
</script>
<style>
.hidden {
visibility: hidden;
}
</style>
</head>
<body>
<!-- this will be replaced -->
</body>
</html>
I have two jsp(one is main page, another one is new window) and single javascript file.
MainPage and New Window have 'Test' , 'ClickedCount' buttons.
First, I click 3 times in MainPage 'Test' button . Then i open New Window.
Now , i click 2 times in newWindow 'Test' button.
So totally i clicked 5 times.
each time i click, i count the button click in javascript.
But mainwindow shows only 3 times, --> getTestButtonClickedCount()
And new window shows only 2 times . --> getTestButtonClickedCount()
Here i use same single javascript file (count.js)
So how to get total clickCount both window (mainWindow + NewWindow) 'Test' button.
MainWindow.jsp
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="count.js" type="text/javascript"></script>
</head>
<body>
<input type="button" value="Test" onclick="countTestButtonClick()"/>
<input type="button" value="ClickedCount" onclick="getTestButtonClickedCount();"/>
<a href="#" onclick = "window.open('NewWindow.jsp','newwindow',
'width=400,height=200')">Click to open New window</a>
</body>
</html>
NewWindow.jsp
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="count.js" type="text/javascript"></script>
</head>
<body>
<input type="button" value="Test" onclick="countTestButtonClick()"/>
<input type="button" value="ClickedCount" onclick="getTestButtonClickedCount();"/>
</body>
</html>
count.js
var clickCount = 0;
function countTestButtonClick()
{
clickCount++;
}
function getTestButtonClickedCount()
{
alert("Total Number of clicked : " + clickCount);
}
Help me about this.
Thanks for your effort.
Remove the JS from the newWindow and change to
<input type="button" value="Test" onclick="opener.countTestButtonClick()"/>
<input type="button" value="ClickedCount" onclick="opener.getTestButtonClickedCount();"/>
Alternatively if one window does not open the other, use a cookie to store the clicks, reading it in and updating it and storing it each time
It might be a simple, but the funny thing is i've tried it for almost 2-3hrs and haven't been able to solve it :(.
I have a parent window, which has a text box, and it has a value. I do a window.open and open a client and try to read the value of the parent, but unable to get the value.
Any help!!
I've tried
window.parent.document.getElementById(window.name)
window.parent.document.getElementById('test').value
window.opener.document.getElementById('teast').value
window.parent.opener.document.getElementById('teast').value
window.opener.parent.document.getElementById('teast').value
Almost all the permutation and combination. And its pure HTML.
Due to security restrictions, Javascript is unable to access documents that reside on a separate domain from the current one. So, if your parent is on a different domain from the child, this will never work.
window.opener.document.getElementById('test').value should work.
I've tried that, it ain't work. I'm posting the code
test.html
<html>
<head>
<title>Chat</title>
</head>
<body>
<div id="chatMessages"></div>
<script>
var newWin = null;
var OpenWindow = null;
function popUp(strURL, strType, strHeight, strWidth) {
if (newWin != null && !newWin.closed)
newWin.close();
var strOptions="";
if (strType=="console")
strOptions="resizable,height="+
strHeight+",width="+strWidth;
if (strType=="fixed")
strOptions="status,height="+
strHeight+",width="+strWidth;
if (strType=="elastic")
strOptions="toolbar,menubar,scrollbars,"+
"resizable,location,height="+
strHeight+",width="+strWidth;
alert(window.parent.document.getElementById(window.name));
newWin = window.open(strURL, 'alertWindow', strOptions);
//newWin.document.getElementById("child").value='Str';
newWin.focus();
// send_data(data);
}
function chat() {
popUp('../alert.jsp','console',250,600);
}
</script>
<form name="AlertReceiverOnHeader" onclick="chat()">
<input type="text" value="teast" id="teast" name="teast"/>
</form>
</html>
child.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Alert</title>
</head>
<body onload="load()">
<script language="JavaScript">
function load() {
alert('In load');
alert("001="+window.parent.document.getElementById('teast'));
alert("002="+window.parent.document.getElementById(window.name));
alert("003="+window.opener.document.getElementById('teast').value);
}
</script>
<form name="child">
<input type="text" id="child" value="child"/>
</form>
</body>
</html>