У меня есть веб-страница, позволяющая динамически создавать выпадающие элементы HTML. На этой странице у меня также есть кнопка «Создать файл». Когда я нажимаю эту кнопку, я хочу, чтобы он сделал запрос AJAX POST и загрузил эту динамическую c страницу, которую я создал, с помощью перетаскивания для загрузки в виде файла.
Вот простой HTML файл для визуализации того, как файл будет выглядеть:
<!doctype html>
<html>
<head>
<title>Test Drag and Drop</title>
</head>
<body>
<div class="dynamicPage">
<div class="subSections">
</div>
<div class="subSections">
</div>
<!-- more elements and objects in here -->
</div>
<div class="stripFromPage">
<!-- More buttons for drag and drop elements to main page -->
<button onclick="createFile(this)">Create File</button>
</div>
</body>
<script>
function createFile(elem){
let url = "action/saveFile";
var formData = new FormData();
formData.append('filename', 'test.html');
formData.append('file', $("html").html());
$.ajax({
type: 'POST',
url: url,
data: formData,
contentType: false,
processData: false,
success: function (data) {
alert(data);
}
});
}
</script>
На стороне сервера у меня есть node.js с методом загрузки, который работает для приложения IOS с использованием метода формы, поэтому я знаю эту часть это хорошо.
Часть, в которой мне нужна помощь, - как загрузить объект DOM в виде файла и добавить его в форму, чтобы указать правильную форму, указать имя этого файла, чтобы бэкэнд мог сохранить его как это имя файла.
Я предпочитаю javascript, чем jquery. Но я не смог найти хорошего javascript кода для AJAX загрузки файла, поэтому у меня есть jquery здесь.