Open a url in new and same tab again and again - javascript

I'm unable to find the answer.
How can I use window.open to open a link in a new tab?
Repeated calling should reload that same tab and not open a new one.
I've a button when clicked should load an url. Repeated click should reload in the same tab/window.

You need to pass a name as the second parameter to window.open
As long as the tab with that name has not been closed, it will be reused.

You can try this
window.open('http://www.example.com','mywindow');
JSFiddle : https://jsfiddle.net/p26c2atz/

In plain JS
<form>
<input type="button" id="openWindow" value="Open Window" onclick="newTab()">
</form>
<script>
function newTab() {
var form = document.createElement("form");
form.method = "GET";
form.action = "http://www.example.com";
form.target = "newWin";
document.body.appendChild(form);
form.submit();
}
</script>
You can see it in action in https://jsfiddle.net/jprbj21u/
Other way will be:
<form>
<input type="button" id="openWindow" value="Open Window" onclick="window.open('http://www.example.com','newWin')">
</form>
The link will open in a tab named "newWin". As long as you open the same window any new URL will load on it.

Here you can do change target after focusout. I tested and its work.
Link
<script type="text/javascript">
$('a').focusout(function(e) {
$(this).attr('target','_self');
});
</script>

window.open(url,'someconstant',"width=600,height=700")
Here on click-event, there will be a new window opened with the instance named 'someconstant', when you do a click again, the window will be opened again overwriting the previous window as your instance is same!.
Hope this helped.! Happy Coding!

Related

How to close the webpage on its own on clicking a button

I have a page where a <button> is kept on which onClick() event fires and redirects the new page in new tab. Meanwhile I want the parent page to close itself as soon as the <button> is clicked with opening the new page in new tab. Its basically for some security feature for the website. How can this be done?
Here is my <button>, let me know where can i correct myself.
<button formtarget="_blank" type="submit" name="submit" onClick="javascript:window.open('quiz.php?unit_id=<?php echo $fnc->encode($unit_id) ; ?>');self.close();" value="submit" class="btn btn-info" style='margin-left: 35%;margin-bottom: 10px;' ><i class="glyphicon"></i> Start Quiz</button>
you can close window by below function
function close(){
setTimeout("window.close()", 500);
}
But keep in mind that : Scripts may close only the windows that were opened by it.
The window close and open new tab
<script language="javascript">
function quitWindow(cmd)
{
if(window.open("your_new_tab_page.htm")){
if (cmd=='quit')
{
open(location, '_self').close();
}
}
return false;
}
</script>
<input type="submit" onclick="return quitWindow('quit');" value="Close This Window and open new Tab" />
If you use firefox, you should about:config by writing url bar and set
dom.allow_scripts_to_close_windows = true
otherwise does not work firefox
I think this might work.
<script>
function openWindow( url )
{
window.open(url, '_blank');
window.focus();
window.close();
}
</script>
<button onclick="javascript:openWindow(yourHref);return false;">Submit</button>
You cant close your webpage if the user clicked the link of your website from any other place other than your website, due to security reasons.

window.open('url', '_self') not working

So i wanted to open a new page replacing the current one, i found that the method should be putting the second parameter on _self but nothing happen...
By the way, if i use the _blank parameter or i left it empty it opens in a new page. The rest of the function works good, but i can't find a way to close the current page and open the new one that i want.
Here is the javascript and the html buttom that call the function.
<button id="rgstr_btn" type="submit" class="btn btn-info" onClick="store()">Register</button>
<script>
function store() {
localStorage.setItem('nome', nome.value);
localStorage.setItem('pw', pw.value);
window.open('url', '_self');
}
</script>
Button has a type attribute which defaults to submit: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type
While this does not affect "everyday" buttons, if the button resides in a form, this way it will submit the form, and result in some page loading, which clashes with your own attempt.
You can just add a type="button" attribute to the button to avoid that:
<button id="rgstr_btn" type="button" class="btn btn-info" onClick="store()">Register</button>
^^^^^^^^^^^^^
windows.open() opens the URL in a new window.
To replace the URL in the current window, use:
window.location.href = 'http://example.com';

populate values from parent window in pop up using javascript

I have a jsp page with a link.
View
When the link is clicked PopUp.jsp opens in another window.
I would like to populate this window with values from the first jsp.
Example:
Parent.jsp
<input type="text" id="name"/>
<input type="text" id="city"/>
View
PopUp.jsp
<script>
function setThis(){
document.getElementById("pname").value=document.getElementById("name").value;
document.getElementById("pcity").value=document.getElementById("city").value;
}
</script>
<body onload="setThis();">
<input type="text" id="pname"/>
<input type="text" id="pcity"/>
</body>
I can't figure out why it doesn't work. Is there a problem with my code?
You can use window.open method and use the object returned by that to access the new window instance. The returned object can be used to access properties and methods of the new window provided it complies with Same origin policy security requirements.
Assuming you have jQuery loaded to your page (If not,you can use vanilla javascript to wire up your click event to your code. use onclick event)
$(function(){
$("#popUp").click(function(e){
e.preventDefault();
var url="url to the new page here";
var newWindow = window.open(url);
var pname="read from this page";
var pcity="read from this page";
newWindow.setThis(pname,pcity);
});
});
Update your setThis to accept these values
function setThis(pname,pcity)
{
.// do something
}

window.close() not working on pop up with pop up

I have a Customer Info form that has anchor tag "close" that should close the current window. This customer form is being opened as pop up. The Customer form also has a search btn that when clicked it pop ups the search form that is being run by a javascript called searchOrder.js. So basically it is a pop up inside a pop up. The customer form's close btn is not working but when the reference to searchOrder.js is removed, it begins to work. Also, when the search pop up is open and I click the "close" anchor tag, it closes the search pop up but never the current window which is the customer form.
Ive tried a lot of solutions already but nothing is working. I used self.close(), window.opener.close(), made it a btn instead of a link etc.,c alled a function onclick
function closeWindow() {
var closeRef;
window.opener='x';
closeRef = window.open('','_parent','');
//or closeRef = window.open("",name);
closeRef.close();
}
heres my gsp code:
<g:form method="post" name="CustomerInfoForm" target="_parent" role="form">
<div class="id="closeLink">Close</div>
<button id="searchOrderButton" type="button" class="button" onclick="searchOrder(document.forms[0].summaryMessage.value,'summaryMessageText','${createLink(action:'searchOrder')}','${createLinkTo(dir:'images',file:'closeButton.gif')}')" value="Search Order">Check Order</button>
</g:form>
How do I make the current window (customer info ) close? tnx
You should use a function like this to close your popup window :
<g:form method="post" name="CustomerInfoForm" target="_parent" role="form">
<div class="id="closeLink">
Close
</div>
<button id="searchOrderButton" type="button" class="button" onclick="searchOrder(document.forms[0].summaryMessage.value,'summaryMessageText','${createLink(action:'searchOrder')}','${createLinkTo(dir:'images',file:'closeButton.gif')}')" value="Search Order">Check Order</button>
</g:form>
<script type="text/javascript">
function openpopup()
{
my_window = window.open("","myPopup","status=1,width=100,height=100");
}
function closepopup()
{
if(false == my_window.closed)
{
my_window.close ();
}
}
</script>
EDIT : Don't forget to open your popup with the openpopup() function :
Open Popup Window
You can shorten window.close() to just close() and shorten window.open() to open(). Maybe you'll find what you need here, though:
http://www.w3schools.com/js/tryit.asp?filename=try_win_closed
http://www.w3schools.com/jsref/obj_window.asp

how to pass value to pop up window using javascript function?

I want to open new window from existing form.When I am clicking on new window in form then new form should open with results of value entered,but new window form is opening with main page,not able to get text box value from parent form.
How to call textfield input value in popup window from parent window using javascript?
//currently I'm using following code:
<script type="text/javascript">
function pop_up5() {
var l_url=window.opener.document.getElementById("name").value;
window.open(l_url,'''','scrollbars=yes,resizable=no,width=550,height=400');
}
</script>
Assign window.open() to a variable so you can access it's elements.
<form>
<input type="textbox" id="txt" />
<input type="button" id="btn" value="Open window" />
</form>
<script>
document.getElementById('btn').onclick = function(){
var myWindow = window.open();
myWindow.document.body.innerHTML = document.getElementById('txt').value;
};
</script>
Suppose your text field's id is myTextField, whatever you named it. if it has no id, set a id for it. then, in the popup window, you can use JavaScript parent.document.getElementById('myTextField').value to get the value of the textfield.

Categories

Resources