Section of Form in home.php
<div id='googleForm'>
<form>
<div class='item'>
<label class='label'>お名前</label>
<input class='inputs' type='text' name='entry.1403582438' required>
</div>
<div class='item'>
<label class='label'>メールアドレス</label>
<input class='inputs' type='email' name='entry.920640653' required>
</div>
<div class='item'>
<label class='label'>お電話番号</label>
<input class='inputs' type='text' name='entry.1631209175' required>
</div>
<div class='item'>
<p class='label'>お問合わせの種類</p>
<div class='inputs'>
<input id='cut' type='radio' name='entry.1757207008' value='1'><label for="cut">無料体験</label>
<input id='cut-color' type='radio' name='entry.1757207008' value='2'><label for="cut-color">料金</label>
<input id='headspa' type='radio' name='entry.1757207008' value='3'><label for="headspa">入会について</label>
<input id='other' type='radio' name='entry.1757207008' value='4'><label for="other">その他</label>
</div>
</div>
<div class='item'>
<label class='label'>お問合わせ内容</label>
<textarea class='inputs' name='entry.669414687' required></textarea>
</div>
<div class='btn-area'>
<input type='submit' value='送信'><input type='reset' value='リセット'>
</div>
</form>
</div>
Section of ajax in home.php
<script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
<script>
$(function() {
$('#googleForm').submit(function(e){
let hostUrl = "https://docs.google.com/forms/u/0/d/e/1FAIpQLSfuXJf8bjE4cYO5f_5g4w-CW0R_LXruvaNG1-veDiEwFh0fEg/formReisponse";
let name = $('input:text[name="entry.1403582438"]').val();
let email = $('input[name="entry.920640653"]').val();
let contact = $('input:text[name="entry.1631209175"]').val();
let category_id = $('input:radio[name="entry.1757207008"]:checked').val();
let inquiry = $('textarea[name="entry.669414687"]').val();
$.ajax({
url: "https://docs.google.com/forms/d/e/1FAIpQLSfuXJf8bjE4cYO5f_5g4w-CW0R_LXruvaNG1-veDiEwFh0fEg/viewform?usp=pp_url",
type: "POST",
data: { "entry.1403582438": name, "entry.920640653": email, "entry.1631209175": contact, "entry.1757207008": category_id, "entry.669414687": inquiry},
dataType: "xml",
statusCode: {
0: function() {
},
200: function() {
}
}
});
e.preventDefault();
});
});
</script>
I would like to submit post request to Google form with ajax.
Why i want to use ajax is because of expecting the web page not to transition to Google Form when submiting post request.
the problem is when submiting the request, it always have been ending up with some errors like below appear on console panel.
I have no idea what to do to solve this problem.
I would be very happy if you share your knowledges.