if you want to pass POST variables, you have to use a HTML Form:
<form action="http://localhost:8080/login" method="POST" target="_blank">
<input type="text" name="cid" />
<input type="password" name="pwd" />
<input type="submit" value="open" />
</form>
or:
if you want to pass GET variables in an URL, write them without single-quotes:
http://yourdomain.com/login?cid=username&pwd=password
here's how to create the string above with javascrpt variables:
myu = document.getElementById('cid').value;
myp = document.getElementById('pwd').value;
window.open("http://localhost:8080/login?cid="+ myu +"&pwd="+ myp ,"MyTargetWindowName");
in the document with that url, you have to read the GET parameters. if it's in php, use:
$_GET['username']
be aware: to transmit passwords that way is a big security leak!
Answer from Roman Abt on Stack Overflowif you want to pass POST variables, you have to use a HTML Form:
<form action="http://localhost:8080/login" method="POST" target="_blank">
<input type="text" name="cid" />
<input type="password" name="pwd" />
<input type="submit" value="open" />
</form>
or:
if you want to pass GET variables in an URL, write them without single-quotes:
http://yourdomain.com/login?cid=username&pwd=password
here's how to create the string above with javascrpt variables:
myu = document.getElementById('cid').value;
myp = document.getElementById('pwd').value;
window.open("http://localhost:8080/login?cid="+ myu +"&pwd="+ myp ,"MyTargetWindowName");
in the document with that url, you have to read the GET parameters. if it's in php, use:
$_GET['username']
be aware: to transmit passwords that way is a big security leak!
Please find this example code, You could use hidden form with POST to send data to that your URL like below:
function open_win()
{
var ChatWindow_Height = 650;
var ChatWindow_Width = 570;
window.open("Live Chat", "chat", "height=" + ChatWindow_Height + ", width = " + ChatWindow_Width);
//Hidden Form
var form = document.createElement("form");
form.setAttribute("method", "post");
form.setAttribute("action", "http://localhost:8080/login");
form.setAttribute("target", "chat");
//Hidden Field
var hiddenField1 = document.createElement("input");
var hiddenField2 = document.createElement("input");
//Login ID
hiddenField1.setAttribute("type", "hidden");
hiddenField1.setAttribute("id", "login");
hiddenField1.setAttribute("name", "login");
hiddenField1.setAttribute("value", "PreethiJain005");
//Password
hiddenField2.setAttribute("type", "hidden");
hiddenField2.setAttribute("id", "pass");
hiddenField2.setAttribute("name", "pass");
hiddenField2.setAttribute("value", "Pass@word$");
form.appendChild(hiddenField1);
form.appendChild(hiddenField2);
document.body.appendChild(form);
form.submit();
}
Yes you can, to some extent by wrapping it in function call. What I typically do is to have a utility function which I can call upon whenever required.
Something like this:
popOpen: function (url, target, height, width) {
var newWindow, args = "";
args += "height=" + height + ",width=" + width;
args += "dependent=yes,scrollbars=yes,resizable=yes";
newWindow = open(url, target, args);
newWindow.focus();
return newWindow;
}
You can further reduce the parameters by making it an object like:
popOpen: function (params) {
var newWindow, args = "";
args += "height=" + params.height + ",width=" + params.width;
args += "dependent=yes,scrollbars=yes,resizable=yes";
newWindow = open(params.url, params.target, params.args);
newWindow.focus();
return newWindow;
}
And you can call it like this:
var param = { url: '...', height: '...', width: '...' };
popOpen(param);
Or,
var param = new Object;
param.url = '...';
param.height = '...';
popOpen(param);
The way you are trying is not possible. You might want to do this:
var myparameters = 'width=' + w + ', height=' + h + ', ' + 'left=' + wleft + ', top=' + wtop + ', ' + tools;
win3 = window.open(u, n, myparameters);
Fiddle: http://jsfiddle.net/aBR7C/
javascript - Window.open and pass parameters by post method - Stack Overflow
Javascript window.open confusing parameters? - Stack Overflow
Opening a window using windows.open() in Javascript - Stack Overflow
window.open - JavaScript window open passing dynamic URL parameters - Stack Overflow
Videos
Instead of writing a form into the new window (which is tricky to get correct, with encoding of values in the HTML code), just open an empty window and post a form to it.
Example:
<form id="TheForm" method="post" action="test.asp" target="TheWindow">
<input type="hidden" name="something" value="something" />
<input type="hidden" name="more" value="something" />
<input type="hidden" name="other" value="something" />
</form>
<script type="text/javascript">
window.open('', 'TheWindow');
document.getElementById('TheForm').submit();
</script>
Edit:
To set the values in the form dynamically, you can do like this:
function openWindowWithPost(something, additional, misc) {
var f = document.getElementById('TheForm');
f.something.value = something;
f.more.value = additional;
f.other.value = misc;
window.open('', 'TheWindow');
f.submit();
}
To post the form you call the function with the values, like openWindowWithPost('a','b','c');.
Note: I varied the parameter names in relation to the form names to show that they don't have to be the same. Usually you would keep them similar to each other to make it simpler to track the values.
Since you wanted the whole form inside the javascript, instead of writing it in tags, you can do this:
let windowName = 'w_' + Date.now() + Math.floor(Math.random() * 100000).toString();
var form = document.createElement("form");
form.setAttribute("method", "post");
form.setAttribute("action", "openData.do");
form.setAttribute("target", windowName);
var hiddenField = document.createElement("input");
hiddenField.setAttribute("type", "hidden");
hiddenField.setAttribute("name", "message");
hiddenField.setAttribute("value", "val");
form.appendChild(hiddenField);
document.body.appendChild(form);
window.open('', windowName);
form.submit();
According to the API specifications of Window.open(), you specify the window features in the 3rd parameter. Therefore, you need to set the 2nd parameter, otherwise whatever you specify in the 2nd parameter will be interpreted as the window name.
you can pass _blank instead of myWindow.
There are a number of issues here. First, of all, the values you use in your example (top=500,left=2000,height=600,width=400) are likely to put at least part of the window off screen. This will be automatically corrected by the browser. As MDN notes:
Requested position (
top,left), and requested dimension (width,height) values inwindowFeatureswill be corrected if any of such requested value does not allow the entire browser popup to be rendered within the work area for applications of the user's operating system. In other words, no part of the new popup can be initially positioned offscreen.
Secondly, in the code where you are checking the position, you're actually reporting the main window's position, not the popup's. Instead of:
console.log("top=" + window.screenY + ", left=" + window.screenX);
That should be:
console.log("top=" + popwin.screenY + ", left=" + popwin.screenX);
This example correctly positions and reports the position of a popup window:
<!DOCTYPE html>
<head>
<script type="text/javascript">
function popup() {
const popwin = window.open(
"",
"",
"top=300,left=300,height=40,width=400,titlebar=no,popup=yes"
);
popwin.document.write(`top=${popwin.screenY}, left=${popwin.screenX}`);
}
popup();
</script>
</head>
<body>
</body>
</html>
Lastly, concerning the address bar: it is in most modern browsers no longer possible to open a popup window without displaying the address bar, for security reasons. See more info in this answer.
In conclusion, there are better alternatives than using popups. They annoy users, and are routinely blocked by browsers. Depending on your use case, you could use something like a dialog element.
Try this code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Popup Test</title>
</head>
<body>
<center>
<p>test page for popup window</p>
</center>
<br />
<br />
<center><button onClick="newwin()">Click to open window</button></center>
<br />
<br />
<script type="text/javascript">
var popwin = null;
function newwin() {
// Get the current window position
var top = window.screenY + 100;
var left = window.screenX + 100;
// Open a new window at the calculated position
popwin = window.open(
"",
"",
`top=${top},left=${left},height=600,width=400,titlebar=no,scrollbars=yes,location=no`
);
popwin.document.write("<p>XXXXX</p>");
console.log("top=" + top + ", left=" + left);
}
</script>
</body>
</html>
This will correctly adjust the position of the new window
Make sure to adjust values as per your requirements
Use window.open():
<a onclick="window.open(document.URL, '_blank', 'location=yes,height=570,width=520,scrollbars=yes,status=yes');">
Share Page
</a>
This will create a link titled Share Page which opens the current url in a new window with a height of 570 and width of 520.
Just use window.open() function? The third parameter lets you specify window size.
Example
var strWindowFeatures = "location=yes,height=570,width=520,scrollbars=yes,status=yes";
var URL = "https://www.linkedin.com/cws/share?mini=true&url=" + location.href;
var win = window.open(URL, "_blank", strWindowFeatures);
var myWindow = window.open(url, windowName[, windowFeatures]);
You can read more about it here: http://developer.mozilla.org/en/DOM/window.open
According the MDN Docs:
This is the URL to be loaded in the newly opened window. strUrl can be an HTML document on the web, it can be an image file or any type of file which is supported by the browser.
I assume this will work in most/all browsers, but the MSDN article doesn't get too specific, so you might have to experiment.
use the parameters top and left, e.g. window.open("index.php?dll=gallery&sub=upload","mywindow","menubar=1,resizable=1,width=660px,height=390px,top=0,left=0");
Having said that, managing popup windows can be troublesome. If it's not necessary for your application, I would simply create a DHTML dialog in your actual page, e.g. jQuery's dialog, jqueryui.com/demos/dialog .
In the 3rd parameter add a left and a top
The newly opened window has a property, which refers to the main window:
var main_window = window.opener;
alert(main_window.location.href); // Example
Propeties defined on the gWindow object at the main page will also be defined at the window (globally) at the opened window, because gWindow refers to the window object of the new window.
Pass them via the query line and parse them on the receiving side.
For example:
window.open("myotherpage.html#param1=X|param2=Y" ...
And inside myotherpage.html, do:
var params = window.location.href.substring(window.location.href.indexOf('#')+1);
params = params.split('|');
for(var i=0; i<params.length; i++) {
var pair = params[i].split('=');
var key = pair[0];
var value = pair[1];
// .. your code here ..
}
Append the parameters to the URL in the following format:
<url>?param1=value1¶m2=value...
If you need to pass an array of values then use the same name for the parameter
<url>?arr=value1&arr=value2...
So your URL would look like
domain.com/Controller/Report?name=xyz&date=20
Update:
To receive them in the Action, declare the parameters being passed to the Action.
public ActionResult Report(string name, DateTime date)
{
...
}
Read up on Model Binding in ASP.NET MVC
I found a better way to pass parameters to the popup window and even to retrieve parameters from it :
In the main page :
var popupwindow;
var sharedObject = {};
function openPopupWindow()
{
// Define the datas you want to pass
sharedObject.var1 =
sharedObject.var2 =
...
// Open the popup window
window.open(URL_OF_POPUP_WINDOW, NAME_OF_POPUP_WINDOW, POPUP_WINDOW_STYLE_PROPERTIES);
if (window.focus) { popupwindow.focus(); }
}
function closePopupWindow()
{
popupwindow.close();
// Retrieve the datas from the popup window
= sharedObject.var1;
= sharedObject.var2;
...
}
In the popup window :
var sharedObject = window.opener.sharedObject;
// function you have to to call to close the popup window
function myclose()
{
//Define the parameters you want to pass to the main calling window
sharedObject.var1 =
sharedObject.var2 =
...
window.opener.closePopupWindow();
}
That's it !
And this is very convenient because:
- You have not to set parameters in the URL of the popup window.
- No form to define
- You can use illimited parameters even objects.
- Bi-directionnal : you can pass parameters AND, if you want you, can retreive new parameters.
- Very easy to implement.
Have Fun!
window.location.href is not a method, it's a property that will tell you the current URL location of the browser. Changing the value of the property will redirect the page.
window.open() is a method that you can pass a URL to that you want to open in a new window. For example:
window.location.href example:
window.location.href = 'http://www.google.com'; //Will take you to Google.
window.open() example:
window.open('http://www.google.com'); //This will open Google in a new window.
Additional Information:
window.open() can be passed additional parameters. See: window.open tutorial
window.openwill open a new browser with the specified URL.window.location.hrefwill open the URL in the window in which the code is called.
Note also that window.open() is a function on the window object itself whereas window.location is an object that exposes a variety of other methods and properties.
Hi, I'm trying to pass two variables to an html page by opening the page using window.open("myfile.html"), I know this: window.open("myfle.html", value) works for passing one variable but it doesn't work for multiple variables. I tried query string but I couldn't make it work. Thanks.
I found why this morning:
In web.config, under globalization, the responseEncoding was set to "cp037". I changed it to "ISO-8859-15" and my windows are popping up correctly.
<globalization fileEncoding="ISO-8859-15" requestEncoding="ISO-8859-15" responseEncoding="ISO-8859-15" culture="auto" uiCulture="auto"/>
One thing for sure: the limitation is not tied to window.open() pre se. My server runs mod_perl, and I use GET requests in window.open() frequently.
windowName
A name to be given to the new window. The name can be used to refer this window again.
After opening the window you will want to do all sorts of things with it e.g. move it it then you can do
<html>
<head>
<title>Window Example</title>
</head>
<SCRIPT language="JavaScript1.2">
function poponload()
{
testwindow= window.open ("", "mywindow");
alert('I will move window to 0,0');
testwindow.moveTo(0,0);
}
</SCRIPT>
<body onload="javascript: poponload()">
<H1>Window Example</H1>
</body>
</html>
And NO its not window title its different.
-source
From MDC on window.open()
window.open(strUrl, strWindowName [, strWindowFeatures]);
strWindowName
This is the string that just names the new window. Such string can be used to be the target of links and forms when the target attribute of an<a>element or of a<form>is specified. This string parameter should not contain any blank space.strWindowNamedoes not specify the title of the new window.