Nouvelle FormData () "application / x-www-form-urlencoded"

Couchdb ne fait que parer application / x-www-form-urlencoded. Existe-t-il un attribut FormData () qui définit l'enctype?

xhr.open('put',document.myForm.action,false) xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded') xhr.send(new FormData(document.myForm)) 

Non, la méthode "envoyer" XHR2 est spécifiée pour toujours envoyer des objets FormData en tant que multiparties / données de forme.

Comme l'indique l'image, une option serait d'utiliser le plugin jquery.couch.js intégré à chaque instance de CouchDB dans Futon.

Si vous aimez une interface HTTP plus générique, Fermata prend également en charge les requêtes encodées URL:

 fermata.json(document.myForm.action).put({'Content-Type':"application/x-www-form-urlencoded"}, {...form fields...}); 

Une autre option serait d'envoyer JSON à votre fonction de mise à jour (ce que je suppose, c'est l'URL 'action' de votre formulaire) à la place.

Bien sûr, l'astuce avec l'un de ces éléments est que vous devrez extraire les champs de formulaire vous-même, car il n'y a pas d'équivalent de niveau DOM simple du new FormData(document.myForm) qui renvoie un objet au lieu de l'AFAIK.

FormData sera toujours envoyé en tant que multipart/form-data .

Si vous souhaitez envoyer FormData sous la forme x-www-form-urlencoded , encodez les éléments de contenu:

 function urlencodeFormData(fd){ var s = ''; function encode(s){ return encodeURIComponent(s).replace(/%20/g,'+'); } for(var pair of fd.entries()){ if(typeof pair[1]=='string'){ s += (s?'&':'') + encode(pair[0])+'='+encode(pair[1]); } } return s; } var form = document.myForm; xhr.open('POST', form.action, false); xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded') xhr.send(urlencodeFormData(new FormData(form))); 

Vous pouvez également utiliser URLSearchParams comme ceci:

 function urlencodeFormData(fd){ var params = new URLSearchParams(); for(var pair of fd.entries()){ typeof pair[1]=='string' && params.append(pair[0], pair[1]); } return params.toString(); } 

Pour les anciens navigateurs qui ne prennent pas en charge l'API URLSearchParams , vous pouvez utiliser l'un des polyfills:

  • Ethanius / URLSearchParams
  • WebReflection / url-search-params

Il y a quelque temps, j'ai écrit la fonction suivante. Il recueille des valeurs de formulaire et les encodeur encodé, de sorte qu'ils peuvent être envoyés avec une application/x-www-form-urlencoded type de contenu application/x-www-form-urlencoded :

 function getURLencodedForm(form) { var urlEncode = function(data, rfc3986) { if (typeof rfc3986 === 'undefined') { rfc3986 = true; } // Encode value data = encodeURIComponent(data); data = data.replace(/%20/g, '+'); // RFC 3986 compatibility if (rfc3986) { data = data.replace(/[!'()*]/g, function(c) { return '%' + c.charCodeAt(0).toString(16); }); } return data; }; if (typeof form === 'string') { form = document.getElementById(form); } var url = []; for (var i=0; i < form.elements.length; ++i) { if (form.elements[i].name != '') { url.push(urlEncode(form.elements[i].name) + '=' + urlEncode(form.elements[i].value)); } } return url.join('&'); } // Example (you can test & execute this here on this page on stackoverflow) var url = getURLencodedForm('post-form'); alert(url);