Javascript window. Відкрити значення пропуску за допомогою POST


78

У мене є функція 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 замовлень із переліком постачальників - я намагаюся відобразити постачальників)

Відповіді:


73

Я використав варіант вищезазначеного, але замість друку html створив форму і надіслав її на сторонню URL-адресу:

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

1
Я думаю document.body.appendChild(mapForm);, що тут це зайве, і його можна сміливо пропустити, щоб не захаращувати DOM.
Федір

2
Видалення цього рядка @Fedor призведе до порожнього спливаючого вікна у Firefox
Mancy

@Mancy дякую за зауваження, не думав про Firefox
Федір

якщо ви не турбуєтесь про свої дані | window.open ('xxx_url.php? xxx_var =' + xxx_var + '& xxx2_var =' + xxx2_var, '_blank');
Руте,

1
@rut Існує різниця між передачею даних як команди GET та POST. Питання було про надсилання даних за допомогою команди POST.
StanE

48

Дякую 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


33

Для чого це варте, ось раніше наданий код, інкапсульований у функцію.

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

2
IMHO Це найкраща відповідь. Зверніть увагу, що він дбає про видалення форми після відправлення, очищення DOM. Вона також записана як готова до використання функція. Хороша робота
Жауме Муссонс Абад

document.body.removeChild (форма); для мене цей рядок гарантував, що поля введення були приховані
Shark Lasers

7

дякую php-b-грейдер!

нижче загальної функції для window.open значення пропуску за допомогою POST:

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

Це абсолютно правильно! Ідеально підходить для того, що мені потрібно. Дякую.
Брендон

2

Незважаючи на те, що це питання було давно, дякую усім за вклади, які допомогли мені вирішити подібну проблему. Я також зробив невелику модифікацію на основі відповідей інших тут і зробив кілька входів / цінностей в єдиний об'єкт (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;

1

Код допоміг мені виконати мою вимогу.

Я вніс деякі зміни та за допомогою форми заповнив це. Ось мій код-

Потрібен атрибут "target" для "form" - і все!

Форма

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

Пояснюється повний код, що показує нормальну форму та елементи форми.

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.