POST फॉर्म सबमिट करने के बाद परिणाम प्रदर्शित करने वाली एक नई विंडो खोलें


149

एक फॉर्म सबमिट की तरह जावास्क्रिप्ट पोस्ट अनुरोध आपको दिखाता है कि आप जावास्क्रिप्ट में POST के माध्यम से एक फॉर्म कैसे सबमिट करें। नीचे मेरा संशोधित कोड है।

var form = document.createElement("form");

form.setAttribute("method", "post");
form.setAttribute("action", "test.jsp");

var hiddenField = document.createElement("input");  

hiddenField.setAttribute("name", "id");
hiddenField.setAttribute("value", "bob");
form.appendChild(hiddenField);
document.body.appendChild(form); // Not entirely sure if this is necessary          
form.submit();

मैं जो करना चाहूंगा वह एक नई विंडो में परिणाम खोल सकता है। मैं वर्तमान में एक नई विंडो में एक पेज खोलने के लिए कुछ इस तरह का उपयोग कर रहा हूं:

onclick = window.open(test.html, '', 'scrollbars=no,menubar=no,height=600,width=800,resizable=yes,toolbar=no,status=no');

2
ध्यान दें कि document.body.appendChild(form) है आवश्यक हो, को देखने के stackoverflow.com/q/42053775/58241
benrwb

जवाबों:


220

जोड़ना

<form target="_blank" ...></form>

या

form.setAttribute("target", "_blank");

आपके फॉर्म की परिभाषा।


विशेषता तत्व को प्रपत्र तत्व में जोड़ने के लिए याद रखें, अन्यथा यह पॉपअप ब्लॉकर बंद होने के बावजूद सफारी ब्राउज़र में काम नहीं करता है। <form id = "popupForm" target = "_ blank" ...> </ form>
नरेन

131

यदि आप अपने फॉर्म को जावास्क्रिप्ट से सबमिट करना और सबमिट करना चाहते हैं जैसा कि आपके प्रश्न में है और आप कस्टम समाधान के साथ पॉपअप विंडो बनाना चाहते हैं, तो मैं इस समाधान का प्रस्ताव देता हूं (मैंने लाइनों के ऊपर टिप्पणी डाल दी)

var form = document.createElement("form");
form.setAttribute("method", "post");
form.setAttribute("action", "test.jsp");

// setting form target to a window named 'formresult'
form.setAttribute("target", "formresult");

var hiddenField = document.createElement("input");              
hiddenField.setAttribute("name", "id");
hiddenField.setAttribute("value", "bob");
form.appendChild(hiddenField);
document.body.appendChild(form);

// creating the 'formresult' window with custom features prior to submitting the form
window.open('test.html', 'formresult', 'scrollbars=no,menubar=no,height=600,width=800,resizable=yes,toolbar=no,status=no');

form.submit();

18
+1 स्वीकार किए गए उत्तर की तुलना में बेहतर है, क्योंकि यह वास्तव में ओपी के विकल्पों के साथ पॉपअप में परिणाम डालता है।
निकोल

IE पर मेरे लिए काम नहीं करता है - यह निर्दिष्ट विशेषताओं के साथ एक नई विंडो बनाता है और फिर एक और नई विंडो में परिणाम लोड करता है, जिससे पिछली विंडो खाली हो जाती है।
मग्गार्ड

1
@ मज्गार्ड: आपने क्या जोड़ा? यह इस उत्तर को संपादित करने का सुझाव देने के लायक हो सकता है।
माइकल मायर्स

3
@ सौरभानंद जहां तक ​​मैं बता सकता हूं, तत्व targetपर विशेषता HTML 4.01 संक्रमणकालीन में वंचित नहीं है और जाहिरा तौर पर HTML 5 में रहना है । form
मार्को डुमिक

1
एक चेतावनी: मुझे अपना प्रपत्र दस्तावेज़ निकाय में संलग्न करना होगा इससे पहले कि यह काम करेगा (एफएफ 17 में)। एक टुकड़ा बनाने और इसे काम करने की कोशिश नहीं की।
voidstate

8
var urlAction = 'whatever.php';
var data = {param1:'value1'};

var $form = $('<form target="_blank" method="POST" action="' + urlAction + '">');
$.each(data, function(k,v){
    $form.append('<input type="hidden" name="' + k + '" value="' + v + '">');
});
$form.submit();

क्या मुझे कुछ याद आ रहा है, या क्या आपको अभी भी .appendनज़दीकी फ़ॉर्म टैग की आवश्यकता है?
TheJollySin

मुझे लगता है कि यह उस रूप में अधूरा है जिस रूप में आपको एक सर्वोत्तम अभ्यास के लिए इसे हटा देना चाहिए।
ncubica

@theJollySin: टैग पर jQuery को कॉल करके, यह एक वास्तविक DOM तत्व में बदल जाएगा और DOM में डालने पर बंद हो जाएगा।
Janus Troelsen

1
मुझे लगता है कि एक लापता परिशिष्ट ('बॉडी') है और अंतिम पंक्ति इस रूप में लिखी जानी चाहिए:$form.appendTo('body').submit();
PBrockmann

1

मैं इस मूल विधि को जानता हूं:

1)

<input type=”image src=”submit.png”> (in any place)

2)

<form name=”print”>
<input type=”hidden name=”a value=”<?= $a ?>”>
<input type=”hidden name=”b value=”<?= $b ?>”>
<input type=”hidden name=”c value=”<?= $c ?>”>
</form>

3)

<script>
$(‘#submit’).click(function(){
    open(”,”results”);
    with(document.print)
    {
        method = POST”;
        action = results.php”;
        target = results”;
        submit();
    }
});
</script>

काम करता है!


3
jquery के साथ thats! वह शुद्ध जेएस के लिए पूछता है
एविटाक्स

1

प्रवाह खिड़की के लिए सबसे सरल काम समाधान (क्रोम में परीक्षण किया गया):

<form action='...' method=post target="result" onsubmit="window.open('','result','width=800,height=400');">
    <input name="..">
    ....
</form>
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.