web-dev-qa-db-ja.com

Axiosを使用してフォームデータを送信する

Htmlフォーム要素からデータをシリアル化してから、Axiosのポストリクエストを使用してデータをポストできるかどうか疑問に思っています。

投稿を送信するためにボタンをクリックしたときに発生するイベントを示すコードは次のとおりです。

function form_submission(e)
{
var data = document.getElementById('venueForm');

axios.post('/venue/', {


})
    .then (function (response) {
        console.log(response);
    })
    .catch(function (error) {

        console.log(error);
    });
}

これは、データがどのように選択されるかを示すhtmlです

<form method="POST" action="http://core-site.test/venue/{{$venue->slug_field}}" accept-charset="UTF-8" id="venueForm">

オプションをシリアル化していますか、または各値を手動で設定する必要がありますか？

javascripthtmllaravelpostaxios
6
Jamie Woods

JavaScriptでFormDataクラスを使用します。

var form = document.querySelector('form');
var data = new FormData(form);
axios.post('/example', data);
11
DigitalDrifter