mirrors/axios
2
0
Fork 0
mirror of https://github.com/tenrok/axios.git synced 2026-06-20 20:00:40 +03:00
Code Activity

refactor: form data handling in index.html (#7170)

Browse Source 
* Refactor form data handling in index.html

* Update examples/postMultipartFormData/index.html

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

* Update examples/postMultipartFormData/index.html

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

---------

Co-authored-by: Jay <jasonsaayman@gmail.com>
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
This commit is contained in:
Anchal Singh
2025-10-23 18:40:03 +05:30
committed by GitHub
parent 889f8ef8be
commit 46e1981d0f
1 changed files with 47 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files
examples/postMultipartFormData/index.html
+33 -36
View File
@@ -70,62 +70,59 @@
<script src="/axios.min.js"></script> <script src="/axios.min.js"></script>
<script> <script>
(function () { (function () {
document.getElementById('post').onclick = function () { document.getElementById('post').onclick = function () {
document.getElementById("checkNetwork").classList.remove("hidden") // Show network/loading indicator
document.getElementById("checkNetwork").classList.remove("hidden");
// Grab values from inputs
var someString = document.getElementById('someString').value; const someString = document.getElementById('someString').value;
var someNumber = document.getElementById('someNumber').valueAsNumber; const someNumber = document.getElementById('someNumber').valueAsNumber;
var files = Array.from(document.getElementById('someSmallFile').files) const files = Array.from(document.getElementById('someSmallFile').files);
var nestedString = document.getElementById('nested.someString').value; const nestedString = document.getElementById('nested.someString').value;
var passAsFormData = document.querySelector('input[name="format"]:checked').value==="formData"; const passAsFormData = document.querySelector('input[name="format"]:checked').value === "formData";
var data = passAsFormData? new FormData() : {} const data = passAsFormData ? new FormData() : {};
function addValueToData(key, val, isValDefined){ // Helper to add value to FormData or plain object
if (!isValDefined){ function addValueToData(key, val, isValDefined) {
return if (!isValDefined) return;
}
if(passAsFormData){ if (passAsFormData) {
data.append(key, val) data.append(key, val);
} else { } else {
const keys = key.split(".");
var keys = key.split(".") if (keys.length === 1) {
if (keys.length===1){ data[key] = val;
data[key] = val
} else { } else {
data[keys[0]]={ // Preserve existing nested objects if any
[keys[1]]: val data[keys[0]] = data[keys[0]] || {};
data[keys[0]][keys[1]] = val;
} }
} }
} }
} addValueToData("someString", someString, someString.length > 0);
addValueToData("someNumber", someNumber, !isNaN(someNumber));
if (files.length) addValueToData("someSmallFile", files[0], true);
addValueToData("nested.someString", nestedString, nestedString !== undefined && nestedString !== null);
addValueToData("someString", someString, someString.length) const errorOutput = document.getElementById("errorOutput");
addValueToData("someNumber", someNumber, !isNaN(someNumber))
if (files.length){
addValueToData("someSmallFile", files[0], true)
}
addValueToData("nested.someString", nestedString, nestedString.length)
var errorOutput = document.getElementById("errorOutput")
axios({ axios({
url: '/postMultipartFormData/server', url: '/postMultipartFormData/server',
data: data, data: data,
method: "post", method: "post",
headers: { "Content-Type": "multipart/form-data" }, headers: passAsFormData ? { "Content-Type": "multipart/form-data" } : {},
}) })
.then(function (res) { .then(res => {
errorOutput.innerHTML = ""; errorOutput.innerHTML = "Successfully posted!";
}) })
.catch(function (err) { .catch(err => {
errorOutput.innerHTML = err.message; console.error("Error posting data:", err);
errorOutput.innerHTML = `${err.message}`;
}); });
}; };
})(); })();
</script> </script>
</body> </body>
</html> </html>