Моя структура HTML такая, как показано ниже, таблица, вложенная в форму, некоторая информация в input
или option
в select
будет отправлена через ajax.
<form>
<table>
<tr>
<td>date</td>
<td><input class="data" type='text' name="date"></td>
</tr>
<tr>
<td>type</td>
<td>
<select id="type" name="type">
<option value="word">word</option>
<option value="phase">phrase</option>
<option value="sentence">sentence</option>
<option value="grammar">grammar</option>
</select>
</td>
</tr>
<tr>
<td>content</td>
<td><textarea class="data" name='content' cols="80" rows="8"></textarea></td>
</tr>
<tr>
<td>meaning</td>
<td><textarea class="data" name='meaning' cols="80" rows="8"></textarea></td>
</tr>
<tr>
<td>source</td>
<td><input class="data" type="text" name="source"></td>
</tr>
<tr>
<td colspan="2"><input type="button" value="submit" id="submit"></td>
</tr>
</table>
</form>
Я получаю formData с нижекод, проверено, что все данные в форме могут получить.
var elements = document.getElementsByClassName("data");
var formData = new FormData();
for(var i = 0; i < elements.length; i++)
{
formData.append(elements[i].name, elements[i].value);
}
var mySelect = document.getElementById("type");
var index = mySelect.selectedIndex;
var svalue = mySelect.options[index].value;
var sname = "type";
formDate.append(sname,svalue);
Здесь немного длинные строки, я хочу более маленький код js.
Есть более простой способ получить formData счистый JS, а не JQuery?