Window.open और पोस्ट विधि द्वारा मापदंडों को पास करें

97

Window.open मेथड के साथ मैं नए साइट को मापदंडों के साथ खोलता हूं, जिसे मुझे पोस्ट मेथड से पास करना होता है। मुझे इसका हल मिल गया है, लेकिन दुर्भाग्य से यह काम नहीं करता है। यह मेरा कोड है:

<script  type="text/javascript">    
function openWindowWithPost(url,name,keys,values)
{
    var newWindow = window.open(url, name);

    if (!newWindow) return false;

    var html = "";
    html += "<html><head></head><body><form id='formid' method='post' action='" + url +"'>";

    if (keys && values && (keys.length == values.length))
        for (var i=0; i < keys.length; i++)
            html += "<input type='hidden' name='" + keys[i] + "' value='" + values[i] + "'/>";

    html += "</form><script type='text/javascript'>document.getElementById(\"formid\").submit()</sc"+"ript></body></html>";

    newWindow.document.write(html);
    return newWindow;
}
</script>

अगला, मैं सरणियाँ बनाता हूं:

<script type="text/javascript">    
var values= new Array("value1", "value2", "value3") 
var keys= new Array("a","b","c") 
</script>

और फोन फ़ंक्शन द्वारा:

<input id="Button1" type="button" value="Pass values" onclick="openWindowWithPost('test.asp','',keys,values)" />

लेकिन, जब मैं इस बटन पर क्लिक करता हूं, तो साइट test.asp खाली है (बेशक मैं कोशिश करता हूं कि मुझे पास वैल्यू मिल जाए - Request.Form("b"))।

मैं इस समस्या को कैसे हल कर सकता हूं, मुझे पास वैल्यू क्यों नहीं मिल रही है?

javascript

— luk4443
स्रोत

2

क्या काम नहीं कर रहा है? मैंने jsfiddle.net/TZMMF पर एक प्रति सहेजी और यह अपेक्षा के अनुरूप कार्य करता है।

— PleaseStand

जवाब के लिए धन्यवाद। हाँ, क्षमा करें - उपरोक्त कोड काम करता है। लेकिन मैं इस फ़ंक्शन को कुंजियों के सरणी के साथ परखता हूं: <script type = "text / javascript"> var values = new Array ("value1", "value2", "value3") var keys = new Array ("1", "2) "," 3 ") // के स्थान पर a, b, c </ script> मुझे Request.Form द्वारा मूल्य मिलता है। (" 2 ") IE और Firefox में मुझे खाली पृष्ठ मिलता है।

— luk4443

121

नई विंडो में फॉर्म लिखने के बजाय (जो एचटीएमएल कोड में मूल्यों की एन्कोडिंग के साथ सही करने के लिए मुश्किल है), बस एक खाली विंडो खोलें और उस पर एक फॉर्म पोस्ट करें।

उदाहरण:

<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>

संपादित करें:

मूल्यों को गतिशील रूप से सेट करने के लिए, आप इस तरह कर सकते हैं:

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();
}

प्रपत्र को पोस्ट करने के लिए आप फ़ंक्शन को मानों के साथ कहते हैं, जैसे openWindowWithPost('a','b','c');।

नोट: मैं प्रपत्र नामों के संबंध में पैरामीटर नामों को यह दिखाने के लिए विविध करता हूं कि उन्हें समान नहीं होना है। आमतौर पर आप उन्हें मूल्यों को ट्रैक करने के लिए सरल बनाने के लिए एक-दूसरे के समान रखेंगे।

— Guffa
स्रोत

ठीक यही मैं सोच रहा था। मूल कोड पोस्ट किया गया था, हालांकि ... IE को छोड़कर काम करने लगता है।

— कृपया

जवाब के लिए धन्यवाद। लेकिन मेरे पास एक मेज है, जहां कॉलम में बटन हैं। जब मैं इस बटन पर क्लिक करता हूं, तो मैं नया पेज खोलता हूं और कुछ पैरामीटर पास करता हूं। इसलिए मुझे फ़ंक्शन लिखना है, और प्रत्येक बटन के लिए इसे कॉल करें और निश्चित तर्क पास करें। मेरा प्रश्न, मैं आपके उपरोक्त कोड को कैसे कार्य कर सकता हूं?

— luk4443 12

1

@ luk4443: यदि आप विंडो खोलते समय URL का उपयोग करते हैं, तो फॉर्म पोस्ट करते समय पृष्ठ को केवल बदल दिया जाएगा। URL actionको फॉर्म की प्रॉपर्टी में डालें ।

— ग्यूफा

1

@ Guffa भी व्यवहार के अनुकरण के लिए किसी भी तरह से target="_blank"?

— एवर्टन

2

@EvertonAgner: विंडो के लिए एक अद्वितीय नाम का उपयोग करें, और यह काम करेगा _blank।

— गुफ़ा

62

चूंकि आप जावास्क्रिप्ट के अंदर पूरे फॉर्म को चाहते थे, इसलिए इसे टैग में लिखने के बजाय, आप यह कर सकते हैं:

var form = document.createElement("form");
form.setAttribute("method", "post");
form.setAttribute("action", "openData.do");

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

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('', 'view');

form.submit();

— किराये का
स्रोत

5

कोई jQuery और शुद्ध जावास्क्रिप्ट आधारित कार्यान्वयन नहीं है। धन्यवाद।

— पवन पिल्लई

2

@ नया पृष्ठ यहां नए टैब में खुला है, क्या मैं पृष्ठ को नई पॉपअप विंडो में खोल सकता हूं?

— यजी

29

भले ही मुझे 3 साल देर हो गई हो, लेकिन गुफ्फा के उदाहरण को सरल बनाने के लिए, आपको पृष्ठ पर फ़ॉर्म की आवश्यकता नहीं है:

$('<form method="post" action="test.asp" target="TheWindow">
       <input type="hidden" name="something" value="something">
       ...
   </form>').submit();

संपादित:

$('<form method="post" action="test.asp" target="TheWindow">
       <input type="hidden" name="something" value="something">
       ...
   </form>').appendTo('body').submit().remove();

शायद किसी के लिए एक उपयोगी टिप :)

— एंड्रियस नरुइसेवीसियस
स्रोत

7

यह समाधान अधूरा है। इसे पहले इस फॉर्म को शरीर में जोड़ना चाहिए और फिर जमा करना होगा। तो जहां यह कहता है .submit (); इसे कहना चाहिए .appendTo ('बॉडी')। सबमिट करें ();

— जोनाथन वैन डे वीन

1

इस भाग के बिना यह $("body").append(form);काम नहीं करेगा

— Axel

4

यदि आप .remove()जोनाथन के सुझाव के बाद जोड़ते हैं .appendTo('body').submit(), तो आप स्वयं के बाद भी सफाई करेंगे और वर्तमान पृष्ठ को प्रपत्र ऑब्जेक्ट के साथ अव्यवस्थित नहीं करेंगे।

— साइमन

24

मैं ऊपर पोस्ट किए गए भाड़े के जवाब से पूरी तरह सहमत हूं और मेरे लिए यह फ़ंक्शन बनाया है जो मेरे लिए काम करता है। यह एक उत्तर नहीं है, यह भाड़े के द्वारा उपरोक्त पोस्ट पर एक टिप्पणी है

function openWindowWithPostRequest() {
  var winName='MyWindow';
  var winURL='search.action';
  var windowoption='resizable=yes,height=600,width=800,location=0,menubar=0,scrollbars=1';
  var params = { 'param1' : '1','param2' :'2'};         
  var form = document.createElement("form");
  form.setAttribute("method", "post");
  form.setAttribute("action", winURL);
  form.setAttribute("target",winName);  
  for (var i in params) {
    if (params.hasOwnProperty(i)) {
      var input = document.createElement('input');
      input.type = 'hidden';
      input.name = i;
      input.value = params[i];
      form.appendChild(input);
    }
  }              
  document.body.appendChild(form);                       
  window.open('', winName,windowoption);
  form.target = winName;
  form.submit();                 
  document.body.removeChild(form);           
}

— Youdhveer
स्रोत

12

आप बस target="_blank"फॉर्म पर उपयोग कर सकते हैं ।

<form action="action.php" method="post" target="_blank">
    <input type="hidden" name="something" value="some value">
</form>

अपने पसंद के तरीके में छिपे इनपुट्स जोड़ें, और फिर जेएस के साथ फॉर्म सबमिट करें।

— घाट
स्रोत

इसके अलावा जब से window.openएक पॉपअप के रूप में अवरुद्ध किया जाएगा, जब एक clickहैंडलर के अंदर नहीं बुलाया जाता है (या किसी भी उपयोगकर्ता ने उस तरह से निकाल दिया घटना)

— Xenos

4

मैंने url, लक्ष्य और ऑब्जेक्ट के रूप में POST/ GETडेटा और सबमिट विधि के आधार पर एक फॉर्म जेनरेट करने के लिए एक फंक्शन बनाया । यह उस ऑब्जेक्ट के भीतर नेस्टेड और मिश्रित प्रकारों का समर्थन करता है, इसलिए यह आपके द्वारा खिलाए गए किसी भी संरचना को पूरी तरह से दोहरा सकता है: PHP स्वचालित रूप से इसे पार्स करता है और इसे नेस्टेड सरणी के रूप में वापस करता है। हालांकि, एक एकल प्रतिबंध है: कोष्ठक [और ]वस्तु में किसी भी कुंजी का हिस्सा नहीं होना चाहिए (जैसे {"this [key] is problematic" : "hello world"})। अगर किसी को पता है कि इसे ठीक से कैसे बचना है, तो कृपया बताएं!

आगे की हलचल के बिना, यहाँ स्रोत है:

कोड स्निपेट दिखाएं

function getForm(url, target, values, method) {
  function grabValues(x) {
    var path = [];
    var depth = 0;
    var results = [];

    function iterate(x) {
      switch (typeof x) {
        case 'function':
        case 'undefined':
        case 'null':
          break;
        case 'object':
          if (Array.isArray(x))
            for (var i = 0; i < x.length; i++) {
              path[depth++] = i;
              iterate(x[i]);
            }
          else
            for (var i in x) {
              path[depth++] = i;
              iterate(x[i]);
            }
          break;
        default:
          results.push({
            path: path.slice(0),
            value: x
          })
          break;
      }
      path.splice(--depth);
    }
    iterate(x);
    return results;
  }
  var form = document.createElement("form");
  form.method = method;
  form.action = url;
  form.target = target;

  var values = grabValues(values);

  for (var j = 0; j < values.length; j++) {
    var input = document.createElement("input");
    input.type = "hidden";
    input.value = values[j].value;
    input.name = values[j].path[0];
    for (var k = 1; k < values[j].path.length; k++) {
      input.name += "[" + values[j].path[k] + "]";
    }
    form.appendChild(input);
  }
  return form;
}

स्निपेट का विस्तार करें

उपयोग उदाहरण:

document.body.onclick = function() {
  var obj = {
    "a": [1, 2, [3, 4]],
    "b": "a",
    "c": {
      "x": [1],
      "y": [2, 3],
      "z": [{
        "a": "Hello",
        "b": "World"
      }, {
        "a": "Hallo",
        "b": "Welt"
      }]
    }
  };

  var form = getForm("http://example.com", "_blank", obj, "post");

  document.body.appendChild(form);
  form.submit();
  form.parentNode.removeChild(form);
}

स्निपेट का विस्तार करें

— समारोह
स्रोत

ओह, उपयोग उदाहरण में URL विकृत था। यदि इसे ठीक किया जाता है, तो कोई और त्रुटि नहीं है।

— समारोह

1

अभी भी टूटा हुआ लगता है, मुझे एक खाली पृष्ठ मिल रहा है।

— एडम पार्किन

2

मुझे पॉपअप विंडो में मापदंडों को पास करने और यहां तक कि मापदंडों को पुनः प्राप्त करने का एक बेहतर तरीका मिला:

मुख्य पृष्ठ में:

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;
    ...
}

पॉपअप विंडो में:

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();
}

बस !

और यह बहुत सुविधाजनक है क्योंकि:

आपको पॉपअप विंडो के URL में पैरामीटर सेट नहीं करना है।
परिभाषित करने के लिए कोई रूप नहीं
आप इलस्ट्रेटेड मापदंडों का उपयोग भी वस्तुओं कर सकते हैं।
द्वि-दिशात्मक: आप मापदंडों को पारित कर सकते हैं और, यदि आप चाहते हैं, तो नए मापदंडों को पुन: प्राप्त कर सकते हैं।
लागू करने के लिए बहुत आसान है।

मज़े करो!

— नीला आदमी
स्रोत

नोट: window.openerसभी ब्राउज़रों से समर्थित नहीं है।

— रैप्टर

1

मैं सादा जे एस का उपयोग कर प्रतिक्रिया और लाने में ऐसा करना चाहता था polyfill । ओपी ने यह नहीं कहा कि वह विशेष रूप से एक फॉर्म बनाना चाहता था और उस पर सबमिट विधि को लागू करना चाहता था, इसलिए मैंने फॉर्म को पोस्ट करके इसे किया है: json:

examplePostData = {
    method: 'POST',
    headers: {
       'Content-type' : 'application/json',
       'Accept' : 'text/html'
    },
    body: JSON.stringify({
        someList: [1,2,3,4],
        someProperty: 'something',
        someObject: {some: 'object'}
    })
}

asyncPostPopup = () => {

    //open a new window and set some text until the fetch completes
    let win=window.open('about:blank')
    writeToWindow(win,'Loading...')

    //async load the data into the window
    fetch('../postUrl', this.examplePostData)
    .then((response) => response.text())
    .then((text) => writeToWindow(win,text))
    .catch((error) => console.log(error))
}

writeToWindow = (win,text) => {
    win.document.open()
    win.document.write(text)
    win.document.close()
}

0

डिफ़ॉल्ट सबमिट एक्शन Ext.form.action.Submit है, जो एक कॉन्फ़िगर URL पर फ़ॉर्म के मूल्यों को सबमिट करने के लिए एक अजाक्स अनुरोध का उपयोग करता है। एक्सट्रीम फॉर्म के सामान्य ब्राउजर सबमिशन को सक्षम करने के लिए, standardSubmit कॉन्फिगर विकल्प का उपयोग करें।

लिंक: http://docs.sencha.com/extjs/4.2.1/#//api/Ext.form.Basic-cfg-standardSubmit

समाधान: standardSubmit डाल: अपने विन्यास में सच है। आशा है कि यह आपकी मदद करेगा :)

— user2420964
स्रोत

0

मैंने अतीत में इसका उपयोग किया है, क्योंकि हम आम तौर पर कोडिंग के लिए रेजर सिंटैक्स का उपयोग करते हैं

@using (Html.BeginForm("actionName", "controllerName", FormMethod.Post, new { target = "_blank" }))

{

// यहां छिपा हुआ और फ़ॉर्म जोड़ें

}

— ransems
स्रोत