Form gönderme gibi JavaScript yayın isteği

Bir tarayıcıyı farklı bir sayfaya yönlendirmeye çalışıyorum. Bir GET isteği istesem,

document.location.href = 'http://example.com/q=a';

Ancak bir POST isteği kullanmadığım sürece erişmeye çalıştığım kaynak düzgün yanıt vermiyor. Bu dinamik olarak oluşturulmamışsa, HTML'yi kullanabilirim

<form action="http://example.com/" method="POST">
  <input type="hidden" name="q" value="a">
</form>

Sonra formu DOM'dan gönderirdim.

Ama gerçekten söylememe izin veren JavaScript kodu istiyorum

post_to_url('http://example.com/', {'q':'a'});

En iyi çapraz tarayıcı uygulaması nedir?

Düzenle

Net olmadığım için üzgünüm. Tıpkı bir form göndermek gibi tarayıcının konumunu değiştiren bir çözüme ihtiyacım var. XMLHttpRequest ile bu mümkün ise , bu açık değildir. Ve bu eşzamansız olmamalı veya XML kullanmamalıdır, bu yüzden Ajax cevap değildir.

<input>Bir formda dinamik olarak s oluşturun ve gönderin

/**
 * sends a request to the specified url from a form. this will change the window location.
 * @param {string} path the path to send the post request to
 * @param {object} params the paramiters to add to the url
 * @param {string} [method=post] the method to use on the form
 */

function post(path, params, method='post') {

  // The rest of this code assumes you are not using a library.
  // It can be made less wordy if you use one.
  const form = document.createElement('form');
  form.method = method;
  form.action = path;

  for (const key in params) {
    if (params.hasOwnProperty(key)) {
      const hiddenField = document.createElement('input');
      hiddenField.type = 'hidden';
      hiddenField.name = key;
      hiddenField.value = params[key];

      form.appendChild(hiddenField);
    }
  }

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

Misal:

post('/contact/', {name: 'Johnny Bravo'});

DÜZENLEME : Bu çok fazla oy kullanıldığından, insanların bunu çok fazla kopyalayıp yapıştıracağını tahmin ediyorum. Bu yüzden hasOwnPropertyyanlışlıkla hataları düzeltmek için onay ekledim .

Bu, jQuery kullanılarak seçilen yanıtın bir sürümü olacaktır .

// Post to the provided URL with the specified parameters.
function post(path, parameters) {
    var form = $('<form></form>');

    form.attr("method", "post");
    form.attr("action", path);

    $.each(parameters, function(key, value) {
        var field = $('<input></input>');

        field.attr("type", "hidden");
        field.attr("name", key);
        field.attr("value", value);

        form.append(field);
    });

    // The form needs to be a part of the document in
    // order for us to be able to submit it.
    $(document.body).append(form);
    form.submit();
}

@Aaron cevabının basit ve hızlı bir şekilde uygulanması:

document.body.innerHTML += '<form id="dynForm" action="http://example.com/" method="post"><input type="hidden" name="q" value="a"></form>';
document.getElementById("dynForm").submit();

Elbette, Prototip veya jQuery gibi bir JavaScript çerçevesi kullanmalısınız ...

IE'nin normal olarak oluşturulan öğelerdeki ad özniteliği ile kırılması nedeniyle gerekli olan bu cevaptacreateElement sağlanan işlevi kullanarak :document.createElement

function postToURL(url, values) {
    values = values || {};

    var form = createElement("form", {action: url,
                                      method: "POST",
                                      style: "display: none"});
    for (var property in values) {
        if (values.hasOwnProperty(property)) {
            var value = values[property];
            if (value instanceof Array) {
                for (var i = 0, l = value.length; i < l; i++) {
                    form.appendChild(createElement("input", {type: "hidden",
                                                             name: property,
                                                             value: value[i]}));
                }
            }
            else {
                form.appendChild(createElement("input", {type: "hidden",
                                                         name: property,
                                                         value: value}));
            }
        }
    }
    document.body.appendChild(form);
    form.submit();
    document.body.removeChild(form);
}

Rakesh Pai'nin cevabı şaşırtıcı, ancak benim için ( Safari'de ) adlı bir alan içeren bir form göndermeye çalıştığımda bir sorun var submit. Örneğin post_to_url("http://google.com/",{ submit: "submit" } );,. Bu değişken uzay çarpışmasını dolaşmak için işlevi hafifçe yamaladım.

    function post_to_url(path, params, method) {
        method = method || "post";

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

        //Move the submit function to another variable
        //so that it doesn't get overwritten.
        form._submit_function_ = form.submit;

        form.setAttribute("method", method);
        form.setAttribute("action", path);

        for(var key in params) {
            var hiddenField = document.createElement("input");
            hiddenField.setAttribute("type", "hidden");
            hiddenField.setAttribute("name", key);
            hiddenField.setAttribute("value", params[key]);

            form.appendChild(hiddenField);
        }

        document.body.appendChild(form);
        form._submit_function_(); //Call the renamed function.
    }
    post_to_url("http://google.com/", { submit: "submit" } ); //Works!

Hayır. Form gönderme gibi JavaScript yayın isteğiniz olamaz.

Sahip olabileceğiniz şey HTML'deki bir formdur, ardından JavaScript ile gönderin. (bu sayfada birçok kez açıklandığı gibi).

HTML'yi kendiniz oluşturabilirsiniz, HTML'yi yazmak için JavaScript'e ihtiyacınız yoktur. İnsanlar bunu önerirse saçma olur.

<form id="ninja" action="http://example.com/" method="POST">
  <input id="donaldduck" type="hidden" name="q" value="a">
</form>

İşleviniz formu istediğiniz gibi yapılandırır.

function postToURL(a,b,c){
   document.getElementById("ninja").action     = a;
   document.getElementById("donaldduck").name  = b;
   document.getElementById("donaldduck").value = c;
   document.getElementById("ninja").submit();
}

Sonra, bu şekilde kullanın.

postToURL("http://example.com/","q","a");

Ama sadece işlevi bırakıp yaparım.

document.getElementById('donaldduck').value = "a";
document.getElementById("ninja").submit();

Son olarak, stil kararı ccs dosyasına girer.

#ninja{ 
  display:none;
}

Şahsen formların isme göre ele alınması gerektiğini düşünüyorum ama bu şu anda önemli değil.

Eğer varsa Prototip yüklü oluşturmak ve bunun gibi gizli formu göndermek için kodu sıkın edebilirsiniz:

 var form = new Element('form',
                        {method: 'post', action: 'http://example.com/'});
 form.insert(new Element('input',
                         {name: 'q', value: 'a', type: 'hidden'}));
 $(document.body).insert(form);
 form.submit();

bu rakesh'in cevabıdır, ancak dizileri destekleyerek (formlarda oldukça yaygındır):

düz javascript:

function post_to_url(path, params, method) {
    method = method || "post"; // Set method to post by default, if not specified.

    // The rest of this code assumes you are not using a library.
    // It can be made less wordy if you use one.
    var form = document.createElement("form");
    form.setAttribute("method", method);
    form.setAttribute("action", path);

    var addField = function( key, value ){
        var hiddenField = document.createElement("input");
        hiddenField.setAttribute("type", "hidden");
        hiddenField.setAttribute("name", key);
        hiddenField.setAttribute("value", value );

        form.appendChild(hiddenField);
    }; 

    for(var key in params) {
        if(params.hasOwnProperty(key)) {
            if( params[key] instanceof Array ){
                for(var i = 0; i < params[key].length; i++){
                    addField( key, params[key][i] )
                }
            }
            else{
                addField( key, params[key] ); 
            }
        }
    }

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

oh, ve jquery sürümü: (biraz farklı kod, ancak aynı şeye kaynar)

function post_to_url(path, params, method) {
    method = method || "post"; // Set method to post by default, if not specified.

    var form = $(document.createElement( "form" ))
        .attr( {"method": method, "action": path} );

    $.each( params, function(key,value){
        $.each( value instanceof Array? value : [value], function(i,val){
            $(document.createElement("input"))
                .attr({ "type": "hidden", "name": key, "value": val })
                .appendTo( form );
        }); 
    } ); 

    form.appendTo( document.body ).submit(); 
}

Çözümlerden biri formu oluşturmak ve göndermek. Bir uygulama

function post_to_url(url, params) {
    var form = document.createElement('form');
    form.action = url;
    form.method = 'POST';

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

    form.submit();
}

Böylece, bir URL kısaltma yer işaretini basit bir

javascript:post_to_url('http://is.gd/create.php', {'URL': location.href});

Keşke diğer tüm yazıları okumuş olsaydım, Rakesh Pai'nin cevabından bunu yaratarak zaman kaybetmedim. İşte diziler ve nesnelerle çalışan özyinelemeli bir çözüm. JQuery'ye bağımlılık yok.

Tüm formun bir dizi gibi gönderilmesi gereken durumları işlemek için bir segment eklendi. (ör. bir öğe listesinin etrafında sarma nesnesi olmadığı durumlarda)

/**
 * Posts javascript data to a url using form.submit().  
 * Note: Handles json and arrays.
 * @param {string} path - url where the data should be sent.
 * @param {string} data - data as javascript object (JSON).
 * @param {object} options -- optional attributes
 *  { 
 *    {string} method: get/post/put/etc,
 *    {string} arrayName: name to post arraylike data.  Only necessary when root data object is an array.
 *  }
 * @example postToUrl('/UpdateUser', {Order {Id: 1, FirstName: 'Sally'}});
 */
function postToUrl(path, data, options) {
    if (options === undefined) {
        options = {};
    }

    var method = options.method || "post"; // Set method to post by default if not specified.

    var form = document.createElement("form");
    form.setAttribute("method", method);
    form.setAttribute("action", path);

    function constructElements(item, parentString) {
        for (var key in item) {
            if (item.hasOwnProperty(key) && item[key] != null) {
                if (Object.prototype.toString.call(item[key]) === '[object Array]') {
                    for (var i = 0; i < item[key].length; i++) {
                        constructElements(item[key][i], parentString + key + "[" + i + "].");
                    }
                } else if (Object.prototype.toString.call(item[key]) === '[object Object]') {
                    constructElements(item[key], parentString + key + ".");
                } else {
                    var hiddenField = document.createElement("input");
                    hiddenField.setAttribute("type", "hidden");
                    hiddenField.setAttribute("name", parentString + key);
                    hiddenField.setAttribute("value", item[key]);
                    form.appendChild(hiddenField);
                }
            }
        }
    }

    //if the parent 'data' object is an array we need to treat it a little differently
    if (Object.prototype.toString.call(data) === '[object Array]') {
        if (options.arrayName === undefined) console.warn("Posting array-type to url will doubtfully work without an arrayName defined in options.");
        //loop through each array item at the parent level
        for (var i = 0; i < data.length; i++) {
            constructElements(data[i], (options.arrayName || "") + "[" + i + "].");
        }
    } else {
        //otherwise treat it normally
        constructElements(data, "");
    }

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

Burada üç seçenek var.

1. Standart JavaScript yanıtı: Bir çerçeve kullanın! Çoğu Ajax çerçevesi, bir XMLHTTPRequest POST oluşturmanın kolay bir yolunu özetler .

2. Gönderiyi get yerine açık yönteme geçirerek XMLHTTPRequest isteğini kendiniz yapın. ( XMLHTTPRequest'te (Ajax) POST yöntemini kullanma hakkında daha fazla bilgi .)

3. JavaScript aracılığıyla dinamik olarak bir form oluşturun, bir eylem ekleyin, girişlerinizi ekleyin ve gönderin.

Diğerleri gibi bir şey ile önerdiğim gibi Ajax rota aşağı gitmek istiyorum:

var xmlHttpReq = false;

var self = this;
// Mozilla/Safari
if (window.XMLHttpRequest) {
    self.xmlHttpReq = new XMLHttpRequest();
}
// IE
else if (window.ActiveXObject) {
    self.xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
}

self.xmlHttpReq.open("POST", "YourPageHere.asp", true);
self.xmlHttpReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');

self.xmlHttpReq.setRequestHeader("Content-length", QueryString.length);



self.xmlHttpReq.send("?YourQueryString=Value");

En kolay yol Ajax Post Request kullanmaktır:

$.ajax({
    type: "POST",
    url: 'http://www.myrestserver.com/api',
    data: data,
    success: success,
    dataType: dataType
    });

nerede:

• veri bir nesnedir
• dataType, sunucu tarafından beklenen verilerdir (xml, json, kod, metin, html)
• url, RESt sunucunuzun adresi veya sunucu tarafında HTTP-POST'u kabul eden herhangi bir işlevdir.

Sonra başarı işleyicide tarayıcıyı window.location gibi bir şeyle yönlendirin.

İşte nasıl jQuery kullanarak yazdı. Firefox ve Internet Explorer'da test edildi.

function postToUrl(url, params, newWindow) {
    var form = $('<form>');
    form.attr('action', url);
    form.attr('method', 'POST');
    if(newWindow){ form.attr('target', '_blank'); 
  }

  var addParam = function(paramName, paramValue) {
      var input = $('<input type="hidden">');
      input.attr({ 'id':     paramName,
                 'name':   paramName,
                 'value':  paramValue });
      form.append(input);
    };

    // Params is an Array.
    if(params instanceof Array){
        for(var i=0; i<params.length; i++) {
            addParam(i, params[i]);
        }
    }

    // Params is an Associative array or Object.
    if(params instanceof Object) {
        for(var key in params){
            addParam(key, params[key]);
        }
    }

    // Submit the form, then remove it from the page
    form.appendTo(document.body);
    form.submit();
    form.remove();
}

Prototip kütüphane kolayca bir sorgu dizesi tarzı dizesine bir JavaScript nesne / yapısını açmak için izin veren bir ".toQueryString ()" yöntemi ile Hashtable'ın nesneyi içerir. Gönderi, isteğin "gövdesi" nin sorgu dizesi biçimli bir dize olmasını gerektirdiğinden, bu, Ajax isteğinizin bir gönderi olarak düzgün çalışmasını sağlar. Prototip kullanan bir örnek:

$req = new Ajax.Request("http://foo.com/bar.php",{
    method: 'post',
    parameters: $H({
        name: 'Diodeus',
        question: 'JavaScript posts a request like a form request',
        ...
    }).toQueryString();
};

Bu benim durumumda mükemmel çalışıyor:

document.getElementById("form1").submit();

Aşağıdaki gibi işlevlerde kullanabilirsiniz:

function formSubmit() {
     document.getElementById("frmUserList").submit();
} 

Bunu kullanarak girişlerin tüm değerlerini kaydedebilirsiniz.

Yine başka bir özyinelemeli çözüm, çünkü bazıları kırılmış gibi görünüyor (hepsini test etmedim). Bu, lodash 3.x ve ES6'ya bağlıdır (jQuery gerekli değildir):

function createHiddenInput(name, value) {
    let input = document.createElement('input');
    input.setAttribute('type','hidden');
    input.setAttribute('name',name);
    input.setAttribute('value',value);
    return input;
}

function appendInput(form, name, value) {
    if(_.isArray(value)) {
        _.each(value, (v,i) => {
            appendInput(form, `${name}[${i}]`, v);
        });
    } else if(_.isObject(value)) {
        _.forOwn(value, (v,p) => {
            appendInput(form, `${name}[${p}]`, v);
        });
    } else {
        form.appendChild(createHiddenInput(name, value));
    }
}

function postToUrl(url, data) {
    let form = document.createElement('form');
    form.setAttribute('method', 'post');
    form.setAttribute('action', url);

    _.forOwn(data, (value, name) => {
        appendInput(form, name, value);
    });

    form.submit();
}

Çözümüm, @RakeshPai tarafından şu anda kabul edilen çözümün aksine, derin iç içe geçmiş nesneleri kodlayacaktır.

Yuvalanmış nesneleri parametrelere dönüştürmek için 'qs' npm kütüphanesini ve stringify işlevini kullanır.

Bu kod bir Rails arka ucu ile iyi çalışır, ancak stringize etmek için geçirilen seçenekleri değiştirerek ihtiyacınız olan arka uçla çalışacak şekilde değiştirebilmeniz gerekir. Raylar, arrayFormat öğesinin "parantez" olarak ayarlanmasını gerektirir.

import qs from "qs"

function normalPost(url, params) {
  var form = document.createElement("form");
  form.setAttribute("method", "POST");
  form.setAttribute("action", url);

  const keyValues = qs
    .stringify(params, { arrayFormat: "brackets", encode: false })
    .split("&")
    .map(field => field.split("="));

  keyValues.forEach(field => {
    var key = field[0];
    var value = field[1];
    var hiddenField = document.createElement("input");
    hiddenField.setAttribute("type", "hidden");
    hiddenField.setAttribute("name", key);
    hiddenField.setAttribute("value", value);
    form.appendChild(hiddenField);
  });
  document.body.appendChild(form);
  form.submit();
}

Misal:

normalPost("/people/new", {
      people: [
        {
          name: "Chris",
          address: "My address",
          dogs: ["Jordan", "Elephant Man", "Chicken Face"],
          information: { age: 10, height: "3 meters" }
        },
        {
          name: "Andrew",
          address: "Underworld",
          dogs: ["Doug", "Elf", "Orange"]
        },
        {
          name: "Julian",
          address: "In a hole",
          dogs: ["Please", "Help"]
        }
      ]
    });

Bu Rails parametrelerini üretir:

{"authenticity_token"=>"...",
 "people"=>
  [{"name"=>"Chris", "address"=>"My address", "dogs"=>["Jordan", "Elephant Man", "Chicken Face"], "information"=>{"age"=>"10", "height"=>"3 meters"}},
   {"name"=>"Andrew", "address"=>"Underworld", "dogs"=>["Doug", "Elf", "Orange"]},
   {"name"=>"Julian", "address"=>"In a hole", "dogs"=>["Please", "Help"]}]}

FormObject bir seçenektir. Ancak FormObject artık çoğu tarayıcı tarafından desteklenmemektedir.

Bu Alan'ın 2. seçeneği (yukarıda) gibidir. Httpobj nasıl başlatılır bir egzersiz olarak bırakılır.

httpobj.open("POST", url, true);
httpobj.setRequestHeader('Content-Type','application/x-www-form-urlencoded; charset=UTF-8');
httpobj.onreadystatechange=handler;
httpobj.send(post);

Bu, jQuery kullanan beauSD koduna dayanmaktadır. Geliştirilmiştir, böylece nesneler üzerinde özyinelemeli olarak çalışır.

function post(url, params, urlEncoded, newWindow) {
    var form = $('<form />').hide();
    form.attr('action', url)
        .attr('method', 'POST')
        .attr('enctype', urlEncoded ? 'application/x-www-form-urlencoded' : 'multipart/form-data');
    if(newWindow) form.attr('target', '_blank');

    function addParam(name, value, parent) {
        var fullname = (parent.length > 0 ? (parent + '[' + name + ']') : name);
        if(value instanceof Object) {
            for(var i in value) {
                addParam(i, value[i], fullname);
            }
        }
        else $('<input type="hidden" />').attr({name: fullname, value: value}).appendTo(form);
    };

    addParam('', params, '');

    $('body').append(form);
    form.submit();
}

DHTML kullanarak formu dinamik olarak ekleyebilir ve sonra gönderebilirsiniz.

JQuery ve $ .post yöntemi gibi bir kitaplık kullanabilirsiniz .

Belge.forms java kullanın ve formdaki tüm öğeleri almak için döngü, sonra xhttp ile göndermek. Bu javascript / ajax gönderme için benim çözüm (örnek olarak tüm html dahil):

          <!DOCTYPE html>
           <html>
           <body>
           <form>
       First name: <input type="text" name="fname" value="Donald"><br>
        Last name: <input type="text" name="lname" value="Duck"><br>
          Addr1: <input type="text" name="add" value="123 Pond Dr"><br>
           City: <input type="text" name="city" value="Duckopolis"><br>
      </form> 



           <button onclick="smc()">Submit</button>

                   <script>
             function smc() {
                  var http = new XMLHttpRequest();
                       var url = "yourphpfile.php";
                     var x = document.forms[0];
                          var xstr = "";
                         var ta ="";
                    var tb ="";
                var i;
               for (i = 0; i < x.length; i++) {
     if (i==0){ta = x.elements[i].name+"="+ x.elements[i].value;}else{
       tb = tb+"&"+ x.elements[i].name +"=" + x.elements[i].value;
             } }

           xstr = ta+tb;
      http.open("POST", url, true);
       http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

      http.onreadystatechange = function() {
          if(http.readyState == 4 && http.status == 200) {

        // do whatever you want to with the html output response here

                } 

               }
            http.send(xstr);

              }
         </script>

         </body>
     </html>

Formu göndermek için jQuery'nin tetikleme yöntemini kullanabilirsiniz, tıpkı bir düğmeye bastığınız gibi,

$('form').trigger('submit')

tarayıcıda gönderilir.

Bir kullanıcıyı otomatik olarak başka bir sayfaya göndermek ve yönlendirmek için kullandığım yöntem, sadece gizli bir form yazmak ve ardından otomatik olarak göndermek. Gizli formun web sayfasında kesinlikle yer kaplamadığından emin olun. Kod şöyle bir şey olurdu:

    <form name="form1" method="post" action="somepage.php">
    <input name="fielda" type="text" id="fielda" type="hidden">

    <textarea name="fieldb" id="fieldb" cols="" rows="" style="display:none"></textarea>
</form>
    document.getElementById('fielda').value="some text for field a";
    document.getElementById('fieldb').innerHTML="some text for multiline fieldb";
    form1.submit();

Otomatik gönderim uygulaması

Otomatik gönderim uygulaması, kullanıcının otomatik olarak diğer sayfaya yerleştirdiği form değerlerini o sayfaya geri yönlendirir. Böyle bir uygulama şöyle olurdu:

fieldapost=<?php echo $_post['fielda'];>
if (fieldapost !="") {
document.write("<form name='form1' method='post' action='previouspage.php'>
  <input name='fielda' type='text' id='fielda' type='hidden'>
</form>");
document.getElementById('fielda').value=fieldapost;
form1.submit();
}

İşte böyle yapıyorum.

function redirectWithPost(url, data){
        var form = document.createElement('form');
        form.method = 'POST';
        form.action = url;

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

Yukarıdaki çözümlerin hiçbiri sadece jQuery ile derin iç içe paramlerle başa çıkmadı, işte benim iki sent çözümüm.

JQuery kullanıyorsanız ve derin iç içe parametreleri işlemeniz gerekiyorsa, bu işlevi aşağıda kullanabilirsiniz:

    /**
     * Original code found here: https://github.com/mgalante/jquery.redirect/blob/master/jquery.redirect.js
     * I just simplified it for my own taste.
     */
    function postForm(parameters, url) {

        // generally we post the form with a blank action attribute
        if ('undefined' === typeof url) {
            url = '';
        }


        //----------------------------------------
        // SOME HELPER FUNCTIONS
        //----------------------------------------
        var getForm = function (url, values) {

            values = removeNulls(values);

            var form = $('<form>')
                .attr("method", 'POST')
                .attr("action", url);

            iterateValues(values, [], form, null);
            return form;
        };

        var removeNulls = function (values) {
            var propNames = Object.getOwnPropertyNames(values);
            for (var i = 0; i < propNames.length; i++) {
                var propName = propNames[i];
                if (values[propName] === null || values[propName] === undefined) {
                    delete values[propName];
                } else if (typeof values[propName] === 'object') {
                    values[propName] = removeNulls(values[propName]);
                } else if (values[propName].length < 1) {
                    delete values[propName];
                }
            }
            return values;
        };

        var iterateValues = function (values, parent, form, isArray) {
            var i, iterateParent = [];
            Object.keys(values).forEach(function (i) {
                if (typeof values[i] === "object") {
                    iterateParent = parent.slice();
                    iterateParent.push(i);
                    iterateValues(values[i], iterateParent, form, Array.isArray(values[i]));
                } else {
                    form.append(getInput(i, values[i], parent, isArray));
                }
            });
        };

        var getInput = function (name, value, parent, array) {
            var parentString;
            if (parent.length > 0) {
                parentString = parent[0];
                var i;
                for (i = 1; i < parent.length; i += 1) {
                    parentString += "[" + parent[i] + "]";
                }

                if (array) {
                    name = parentString + "[" + name + "]";
                } else {
                    name = parentString + "[" + name + "]";
                }
            }

            return $("<input>").attr("type", "hidden")
                .attr("name", name)
                .attr("value", value);
        };


        //----------------------------------------
        // NOW THE SYNOPSIS
        //----------------------------------------
        var generatedForm = getForm(url, parameters);

        $('body').append(generatedForm);
        generatedForm.submit();
        generatedForm.remove();
    }

İşte nasıl kullanılacağına dair bir örnek. Html kodu:

<button id="testButton">Button</button>

<script>
    $(document).ready(function () {
        $("#testButton").click(function () {
            postForm({
                csrf_token: "abcd",
                rows: [
                    {
                        user_id: 1,
                        permission_group_id: 1
                    },
                    {
                        user_id: 1,
                        permission_group_id: 2
                    }
                ],
                object: {
                    apple: {
                        color: "red",
                        age: "23 days",
                        types: [
                            "golden",
                            "opal",
                        ]
                    }
                },
                the_null: null, // this will be dropped, like non-checked checkboxes are dropped
            });
        });
    });
</script>

Test düğmesine tıklarsanız formu gönderir ve POST'ta aşağıdaki değerleri alırsınız:

array(3) {
  ["csrf_token"] => string(4) "abcd"
  ["rows"] => array(2) {
    [0] => array(2) {
      ["user_id"] => string(1) "1"
      ["permission_group_id"] => string(1) "1"
    }
    [1] => array(2) {
      ["user_id"] => string(1) "1"
      ["permission_group_id"] => string(1) "2"
    }
  }
  ["object"] => array(1) {
    ["apple"] => array(3) {
      ["color"] => string(3) "red"
      ["age"] => string(7) "23 days"
      ["types"] => array(2) {
        [0] => string(6) "golden"
        [1] => string(4) "opal"
      }
    }
  }
}

Not: formu geçerli sayfadan başka bir url'ye göndermek istiyorsanız, url'yi postForm işlevinin ikinci bağımsız değişkeni olarak belirleyebilirsiniz.

Örneğin (örneğinizi tekrar kullanmak için):

postForm({'q':'a'}, 'http://example.com/');

Bu yardımcı olur umarım.

Not2: kod yönlendirme eklentisinden alınmıştır . Temelde ihtiyaçlarım için basitleştirdim.

POST veya GET ile yönlendirme için jQuery eklentisi:

https://github.com/mgalante/jquery.redirect/blob/master/jquery.redirect.js

Test etmek için yukarıdaki .js dosyasını ekleyin veya sınıfı kodunuza kopyalayıp yapıştırın, ardından "args" yerine değişken adlarınızı ve "değerleri" bu değişkenlerin değerleriyle değiştirin:

$.redirect('demo.php', {'arg1': 'value1', 'arg2': 'value2'});

AJAX çağrısı yapabilirsiniz (büyük olasılıkla Prototype.js veya JQuery kullanmak gibi bir kitaplık kullanarak). AJAX hem GET hem de POST seçeneklerini işleyebilir.