Recently I got this scenario and researched a lot to find the hack/solution.
Solution - If you can put a window names and refer same every time, then browser will make sure to open new tab if not opened already, otherwise it will just refresh the window.
Example snippet: demo here
<form id="myForm" action="<URL>" method="POST" target="_blank" onsubmit="target_popup(this)">
First name: <input type="text" name="fname"/><br/>
Last name: <input type="text" name="lname"/><br/>
<button type="submit" id="btnTest"> Submit</button>
</form>
<script>
var target_popup = function(form) {
window.open('',//URL should be blank so that it will take form attributes.
'UniqueWindowName', //window name
'width=400,height=400,resizeable,scrollbars');
form.target = 'UniqueWindowName';
}
</script>
Another way of posting a form is via javascript itself. When form is posted using form.submit() function, then onsubmit event will not fire ( as per javascript documentation ). Hence we have to tweak the hack a little bit to achieve the same behavior. Code snippet given below:
function test(windowName){
var form = document.createElement("form");
var element1 = document.createElement("input");
var element2 = document.createElement("input");
form.method = "POST";
form.action = "{!URLFOR($Page.formPost2)}";
var win = window.open('', windowName, 'width=400,height=400,resizeable,scrollbars');
form.target = windowName;
form.id="testForm"+windowName;
//form.onsubmit = target_popup2;
element1.value= Math.random();
element1.name="fname";
element1.type="text";
form.appendChild(element1);
element2.value=Math.random();
element2.name="lname";
element2.type="text";
form.appendChild(element2);
document.body.appendChild(form);
form.submit();
win.focus();
}
Solution - If you can put a window names and refer same every time, then browser will make sure to open new tab if not opened already, otherwise it will just refresh the window.
Example snippet: demo here
<form id="myForm" action="<URL>" method="POST" target="_blank" onsubmit="target_popup(this)">
First name: <input type="text" name="fname"/><br/>
Last name: <input type="text" name="lname"/><br/>
<button type="submit" id="btnTest"> Submit</button>
</form>
<script>
var target_popup = function(form) {
window.open('',//URL should be blank so that it will take form attributes.
'UniqueWindowName', //window name
'width=400,height=400,resizeable,scrollbars');
form.target = 'UniqueWindowName';
}
</script>
Another way of posting a form is via javascript itself. When form is posted using form.submit() function, then onsubmit event will not fire ( as per javascript documentation ). Hence we have to tweak the hack a little bit to achieve the same behavior. Code snippet given below:
function test(windowName){
var form = document.createElement("form");
var element1 = document.createElement("input");
var element2 = document.createElement("input");
form.method = "POST";
form.action = "{!URLFOR($Page.formPost2)}";
var win = window.open('', windowName, 'width=400,height=400,resizeable,scrollbars');
form.target = windowName;
form.id="testForm"+windowName;
//form.onsubmit = target_popup2;
element1.value= Math.random();
element1.name="fname";
element1.type="text";
form.appendChild(element1);
element2.value=Math.random();
element2.name="lname";
element2.type="text";
form.appendChild(element2);
document.body.appendChild(form);
form.submit();
win.focus();
}
Comments
Post a Comment