mirrors/axios
2
0
Fork 0
mirror of https://github.com/tenrok/axios.git synced 2026-05-15 11:59:42 +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
+47 -50
View File
@@ -70,62 +70,59 @@
<script src="/axios.min.js"></script>
<script>
(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
const someString = document.getElementById('someString').value;
const someNumber = document.getElementById('someNumber').valueAsNumber;
const files = Array.from(document.getElementById('someSmallFile').files);
const nestedString = document.getElementById('nested.someString').value;
const passAsFormData = document.querySelector('input[name="format"]:checked').value === "formData";
var someString = document.getElementById('someString').value;
var someNumber = document.getElementById('someNumber').valueAsNumber;
var files = Array.from(document.getElementById('someSmallFile').files)
var nestedString = document.getElementById('nested.someString').value;
var passAsFormData = document.querySelector('input[name="format"]:checked').value==="formData";
const data = passAsFormData ? new FormData() : {};
var data = passAsFormData? new FormData() : {}
// Helper to add value to FormData or plain object
function addValueToData(key, val, isValDefined) {
if (!isValDefined) return;
function addValueToData(key, val, isValDefined){
if (!isValDefined){
return
}
if (passAsFormData) {
data.append(key, val);
} else {
const keys = key.split(".");
if (keys.length === 1) {
data[key] = val;
} else {
// Preserve existing nested objects if any
data[keys[0]] = data[keys[0]] || {};
data[keys[0]][keys[1]] = val;
}
}
}
if(passAsFormData){
data.append(key, val)
} else {
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);
var keys = key.split(".")
if (keys.length===1){
data[key] = val
} else {
data[keys[0]]={
[keys[1]]: val
}
}
}
const errorOutput = document.getElementById("errorOutput");
}
addValueToData("someString", someString, someString.length)
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({
url: '/postMultipartFormData/server',
data: data,
method: "post",
headers: { "Content-Type": "multipart/form-data" },
})
.then(function (res) {
errorOutput.innerHTML = "";
})
.catch(function (err) {
errorOutput.innerHTML = err.message;
});
};
})();
</script>
axios({
url: '/postMultipartFormData/server',
data: data,
method: "post",
headers: passAsFormData ? { "Content-Type": "multipart/form-data" } : {},
})
.then(res => {
errorOutput.innerHTML = "Successfully posted!";
})
.catch(err => {
console.error("Error posting data:", err);
errorOutput.innerHTML = `${err.message}`;
});
};
})();
</script>
</body>
</html>