Submitting form to new window

 Comments

Today one of my co-workers was in an effort to submit a form that would bring up a new popup window. After some Googling, they found a solution.
<form name="datacollector" method="POST" action="new-url.do" target="_blank">
<!--
     ...
     other form elements
     ...
-->
</form>
Though this was getting them a new window, on Firefox it was appearing as a new tab. They soon found a setting in FF, that would bring it to a new window itself. However, they wanted a popup without any toolbars, menus etc.

They approached me. Thanks to one of my student days HTML/JavaScript tutorial. I was able to recollect it and give them a solution.
<script type="text/javascript">
   function submitToNewWindow(frm) {
       window.open('','popupWin','scrollbars=no,menubar=no,height=600,width=800,resizable=yes,toolbar=no,status=no');
       frm.action= "new-url.do";
       frm.target = "popupWin";
       frm.submit();
   }
</script>
...
...
<form name="datacollector" method="POST">
<!--
     ...
     other form elements
     ...
-->
      <input type="button" value"Generate" onclick="javascript:submitToNewWindow(this.form)"/>
</form>
The idea is simple. Open a window with a name (here popupWin) using JavaScript that will have no scrollbar, menu, etc. Now in the form's target, supply this window name. This would bring up the form submission's result on the specified popup window. As far as the "_blank" is concerned, it is a HTML's default name for a new blank window.

This is a basic feature of HTML, that in the target, it accepts the name of a window. Note that if a window with that name does not exist, probably a new one will be created.

This solution was tested to be working in FF as well as IE.

Though this is a simple solution, I thought to put up here on my blog, as my co-workers were not able to get anything like this on Googling.

HTML TIPS
blog comments powered by Disqus