Tengo un formulario con un campo de entrada donde los usuarios introducen datos. Uso Ajax para enviarlo y quiero que cada campo se envíe a concat. un valor. Entonces, si el usuario introduce test. El resultado visible debería ser www.google.com/test . Este es mi código:
<form> <input type="text" id="test" name="test"> </form>Ajax
$(document).ready(function() { if ($("#formid").length) { $("#formid").submit(function(event) { var form = $(this); var url = form.attr('action'); $.ajax({ type: "POST", url: url, data: form.serialize(), //success... Y cuando hago ...data: form.serialize() + '&test=' + testtest, simplemente agregará otro valor a la id test . ¿Cómo puedo hacer el concat?
Si está seguro de que sus usuarios tienen navegadores modernos, puede usar la API FormData para modificar el contenido y luego usar la API URLSearchParams para serializarlo, por ejemplo:
let formData = new FormData(document.getElementById('formid')); for (let key of formData.keys()) { formData.set(key, 'http://' + formData.get(key)) } var url = form.attr('action'); $.ajax({ type: "POST", url: url, data: new URLSearchParams(formData).toString() });Editar: un ejemplo para hacer coincidir una lista de claves pero no todas las claves:
let formData = new FormData(document.getElementById('formid')); let specialKeys = ['specialKey1', 'specialKey2']; for (let key of formData.keys()) { if(specialKeys.includes(key)) formData.set(key, 'http://' + formData.get(key)) } var url = form.attr('action'); $.ajax({ type: "POST", url: url, data: new URLSearchParams(formData).toString() }); Editar: para manejar el caso de claves duplicadas en formularios, no podemos usar sin ambigüedades los métodos .get y .set , sino que debemos agregar los datos a un nuevo formulario de datos, por ejemplo:
let formData = new FormData(document.getElementById('formid')); let specialKeys = ['specialKey1', 'specialKey2']; let modifiedFormData = new FormData(); for (let [key, value] of formData.entries()) { if(specialKeys.includes(key)) { modifiedFormData.append( key, 'http://'+ value ) }else{ modifiedFormData.append( key, value ) } } let newDataAsString = new URLSearchParams(modifiedFormData).toString(); var url = form.attr('action'); $.ajax({ type: "POST", url: url, data: newDataAsString, });