2009-06-14 16 views
54

tengo este sencillo formulario:Adición de parámetros POST antes de presentar

<form id="commentForm" method="POST" action="api/comment"> 
    <input type="text" name="name" title="Your name"/> 
    <textarea cols="40" rows="10" name="comment" title="Enter a comment"> 
    </textarea> 
    <input type="submit" value="Post"/> 
    <input type="reset" value="Reset"/> 
</form> 

tengo que añadir dos parámetros POST antes de enviar al servidor:

var params = [ 
       { 
       name: "url", 
       value: window.location.pathname 
       }, 
       { 
        name: "time", 
        value: new Date().getTime() 
       } 
      ]; 

sin modificar el formulario, por favor.

+8

Sólo una nota: Basándose en el usuario suministre una hora válida y url podría llevar a problemas. – merkuro

Respuesta

87

añadir que usando jQuery:

$('#commentForm').submit(function(){ //listen for submit event 
    $.each(params, function(i,param){ 
     $('<input />').attr('type', 'hidden') 
      .attr('name', param.name) 
      .attr('value', param.value) 
      .appendTo('#commentForm'); 
    }); 

    return true; 
}); 
+13

Eso es modificar el formulario – Hontoni

+0

@Hontoni Podemos verificar si el elemento de parámetro existe en el formulario antes de adjuntarlo al formulario, que puede hacer que el elemento de parámetro se anexe solo una vez. – guogangj

+0

Puede usar 'myInput = document.createElement ('input')' y luego establecer los atributos como objeto, como este: 'myInput.type = 'text'; myInput.name = 'name'' –

18

respuesta anterior puede ser acortada y ser más legible .

$('#commentForm').submit(function() { 
    $(this).append($.map(params, function (param) { 
     return $('<input>', { 
      type: 'hidden', 
      name: param.name, 
      value: param.value 
     }) 
    })) 
}); 
2

Usted puede hacer una form.serializeArray(), a continuación, añadir pares de nombre y valor antes de la publicación:

var form = $(this).closest('form'); 

form = form.serializeArray(); 

form = form.concat([ 
    {name: "customer_id", value: window.username}, 
    {name: "post_action", value: "Update Information"} 
]); 

$.post('/change-user-details', form, function(d) { 
    if (d.error) { 
     alert("There was a problem updating your user details") 
    } 
}); 
6

Si desea añadir parámetros sin modificar la forma, usted tiene que serializar el formulario , añadir sus parámetros y enviarlo con AJAX:

var formData = $("#commentForm").serializeArray(); 
formData.push({name: "url", value: window.location.pathname}); 
formData.push({name: "time", value: new Date().getTime()}); 

$.post("api/comment", formData, function(data) { 
    // request has finished, check for errors 
    // and then for example redirect to another page 
}); 

Ver .serializeArray() y $.post() documentación.

0

JavaScript puro:

Creación del XMLHttpRequest:

function getHTTPObject() { 
    /* Crea el objeto AJAX. Esta funcion es generica para cualquier utilidad de este tipo, 
     por lo que se puede copiar tal como esta aqui */ 
    var xmlhttp = false; 
    /* No mas soporte para Internet Explorer 
    try { // Creacion del objeto AJAX para navegadores no IE 
     xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); 
    } catch(nIE) { 
     try { // Creacion del objet AJAX para IE 
      xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
     } catch(IE) { 
      if (!xmlhttp && typeof XMLHttpRequest!='undefined') 
       xmlhttp = new XMLHttpRequest(); 
     } 
    } 
    */ 
    xmlhttp = new XMLHttpRequest(); 
    return xmlhttp; 
} 

JavaScript función para enviar la información a través de POST:

function sendInfo() { 
    var URL = "somepage.html"; //depends on you 
    var Params = encodeURI("var1="+val1+"var2="+val2+"var3="+val3); 
    console.log(Params); 
    var ajax = getHTTPObject();  
    ajax.open("POST", URL, true); //True:Sync - False:ASync 
    ajax.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); 
    ajax.setRequestHeader("Content-length", Params.length); 
    ajax.setRequestHeader("Connection", "close"); 
    ajax.onreadystatechange = function() { 
     if (ajax.readyState == 4 && ajax.status == 200) { 
      alert(ajax.responseText); 
     } 
    } 
    ajax.send(Params); 
} 
-1

Puede hacer una llamada ajax.

esta manera, usted sería capaz de rellenar la matriz de POST a sí mismo a través del Ajax de datos: 'parámetro

var params = { 
    url: window.location.pathname, 
    time: new Date().getTime(), 
}; 


$.ajax({ 
    method: "POST", 
    url: "your/script.php", 
    data: params 
}); 
+0

Debería mostrar un ejemplo. Puede usar los fragmentos incrustados de SO para hacerlo fácilmente – Mawcel

Cuestiones relacionadas