使用POST的Javascript window.open傳遞值

Question

我有一個JavaScript函數，它使用window.open調用另一個頁面並返回結果。

這裏是我的代碼段：

var windowFeatures = "status=0, toolbar=0, location=0, menubar=0, directories=0, resizable=1, scrollbars=1"; 
window.open ('http://www.domain.com/index.php?p=view.map&coords=' + encodeURIComponent(coords), 'JobWindow', windowFeatures); 

我現在的問題是，我要傳遞的數據量爲GET來處理，我需要使用POST方法來傳遞。

我如何轉換上面的代碼中使用POST方法打開的頁面沒有實現所有在網頁表單（網頁訂單的列表100與供應商的名單 - 我想供應商映射）

Answer 1

我用上述的變型，但不是打印HTML我建立了一個表格，並提交給第三方網址：

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

Answer 2

謝謝PHP-b-年級。我改進了代碼，沒有必要使用window.open（）,目標已經在表中指定。

// Create a form 
var mapForm = document.createElement("form"); 
mapForm.target = "_blank";  
mapForm.method = "POST"; 
mapForm.action = "abmCatalogs.ftl"; 

// Create an input 
var mapInput = document.createElement("input"); 
mapInput.type = "text"; 
mapInput.name = "variable"; 
mapInput.value = "lalalalala"; 

// Add the input to the form 
mapForm.appendChild(mapInput); 

// Add the form to dom 
document.body.appendChild(mapForm); 

// Just submit 
mapForm.submit(); 

的目標選項 - >w3schools - Target

Answer 3

感謝PHP-B-年級！

下面使用POST window.open傳值的通用功能：

function windowOpenInPost(actionUrl,windowName, windowFeatures, keyParams, valueParams) 
{ 
    var mapForm = document.createElement("form"); 
    var milliseconds = new Date().getTime(); 
    windowName = windowName+milliseconds; 
    mapForm.target = windowName; 
    mapForm.method = "POST"; 
    mapForm.action = actionUrl; 
    if (keyParams && valueParams && (keyParams.length == valueParams.length)){ 
     for (var i = 0; i < keyParams.length; i++){ 
     var mapInput = document.createElement("input"); 
      mapInput.type = "hidden"; 
      mapInput.name = keyParams[i]; 
      mapInput.value = valueParams[i]; 
      mapForm.appendChild(mapInput); 

     } 
     document.body.appendChild(mapForm); 
    } 


    map = window.open('', windowName, windowFeatures); 
if (map) { 
    mapForm.submit(); 
} else { 
    alert('You must allow popups for this map to work.'); 
}} 

Answer 4

代碼幫助我實現我的要求。

我已經做了一些修改，並使用我完成了這個表單。這裏是我的代碼 -

需要'表單'的'target'屬性 - 就是這樣！

表

<form id="view_form" name="view_form" method="post" action="view_report.php" target="Map" > 
    <input type="text" value="<?php echo $sale->myvalue1; ?>" name="my_value1"/> 
    <input type="text" value="<?php echo $sale->myvalue2; ?>" name="my_value2"/> 
    <input type="button" id="download" name="download" value="View report" onclick="view_my_report();" /> 
</form> 

的JavaScript

function view_my_report() {  
    var mapForm = document.getElementById("view_form"); 
    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.'); 
    } 
} 

完整代碼進行說明示出正常形態和形式的元件。

Answer 5

即使這個問題很久以前，感謝所有幫助我解決類似問題的輸入。 我也根據別人的答案做了一些修改，並在單個對象（json）中創建多個輸入/貴重物品;並希望這可以幫助某人。

JS：

//example: params={id:'123',name:'foo'}; 

mapInput.name = "data"; 
mapInput.value = JSON.stringify(params); 

PHP：

$data=json_decode($_POST['data']); 

echo $data->id; 
echo $data->name; 

Answer 6

對於它的價值，這裏有一個函數內封裝先前提供的代碼。

openWindowWithPost("http://www.example.com/index.php", { 
    p: "view.map", 
    coords: encodeURIComponent(coords) 
}); 

功能定義：

function openWindowWithPost(url, data) { 
    var form = document.createElement("form"); 
    form.target = "_blank"; 
    form.method = "POST"; 
    form.action = url; 
    form.style.display = "none"; 

    for (var key in data) { 
     var input = document.createElement("input"); 
     input.type = "hidden"; 
     input.name = key; 
     input.value = data[key]; 
     form.appendChild(input); 
    } 

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