Window.Open and Pass Parameters by Post Method

Window.open and pass parameters by post method

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.

Javascript window.open pass values using POST

I used a variation of the above but instead of printing html I built a form and submitted it to the 3rd party url:

    var mapForm = document.createElement("form");
    mapForm.target = "Map";
    mapForm.method = "POST"; // or "post" if appropriate
    mapForm.action = "http://www.url.com/map.php";

    var mapInput = document.createElement("input");
    mapInput.type = "text";
    mapInput.name = "addrs";
    mapInput.value = data;
    mapForm.appendChild(mapInput);

    document.body.appendChild(mapForm);

    map = window.open("", "Map", "status=0,title=0,height=600,width=800,scrollbars=1");

if (map) {
    mapForm.submit();
} else {
    alert('You must allow popups for this map to work.');
}

Window.Open POST

You cannot trigger a javascript popup and then force a post request.

Three options:

1. Trigger a POST form with target="_blank" using javascript (but this doesn't allow you to disable interface elements such as the menu bar).

2. Open a popup locally, but don't specify a url. Use the result of window.open to alter the document to generate a form, which you'd then post.

   var myWindow = window.open("", "", "height=600,width=800,scrollbars=1,location=no,menubar=no,resizable=1,status=no,toolbar=no");
   myWindow.document.write("Write a form here and then later on trigger it");
   

3. You really shouldn't do any of this. If it's bad for users to copy urls, there's a flaw in your application design.

4. Added after edit: Use the 'empty window' approach, but instead of writing a form and triggering it, do a an XMLHTTPRequest (with POST) in the parent. The result of this request can be used to populate the child-window.

Pass parameters (left, top values) in window.open method with javascript

You are passing "wc", not the value of wc. Change this:

"....,left=wc";

to

"....,left=" + wc;

How to replace window.open(...) with a POST

In fact I made a small "library" for this, open in POST a new window :

// Arguments :
//  verb : 'GET'|'POST'
//  target : an optional opening target (a name, or "_blank"), defaults to "_self"
window.io = {
    open: function(verb, url, data, target){
        var form = document.createElement("form");
        form.action = url;
        form.method = verb;
        form.target = target || "_self";
        if (data) {
            for (var key in data) {
                var input = document.createElement("textarea");
                input.name = key;
                input.value = typeof data[key] === "object"
                    ? JSON.stringify(data[key])
                    : data[key];
                form.appendChild(input);
            }
        }
        form.style.display = 'none';
        document.body.appendChild(form);
        form.submit();
        document.body.removeChild(form);
    }
};

Example :

io.open('POST', 'fileServer.jsp', {request: {key:"42", cols:[2, 3, 34]}});

To open in a new window, set the target parameter :

io.open('POST', someURL, someArgs, 'newwin');

or to ensure it's a new window/tab each time :

io.open('POST', someURL, someArgs, '_blank');

---

Related Topics