前提・実現したいこと
お問い合わせフォームを、javascriptとgoogle apps script を使用して作成したい。
サイトから申し込みがあったらその情報がスプレットシートに自動的に追加されて そのメールアドレスにサンキューメールの自動返信をしたいです。
発生している問題・エラーメッセージ
サイトのコードはビザスクで知り合った方に書いていただいたのですが、gas側で記載するコードをどのようにすればいいのか分かりません。本やインターネットで勉強はしたのですが上手くできませんでした。
該当のソースコード
こちらが作っていただいたコードです。 これに対応する形で、gasのコードを書いていきたいです。 ヒントだけでも教えていただけますと嬉しいです。 HTML CSS Javascript <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="theme-color" content="#007BBB"> <style> * { margin: 0; padding: 0; box-sizing: border-box; } body { } label { display: block; margin: 16px; } span { display: block; font-size: 13px; font-weight: bold; } input, textarea, button { border: none; appearance: none; padding: .5em .6em; display: inline-block; border: 1px solid #ccc; border-radius: 4px; vertical-align: middle; width: 100%; } input:focus, textarea:focus, button:focus { outline: 0; border-color: #129FEA; } #mask { position: absolute; z-index: 10; top: 0px; right: 0px; bottom: 0px; left: 0px; flex-direction: column; justify-content: center; align-items: center; background: rgba(0, 0, 0, .7); color: #fff; font-weight: bold; display: none; opacity: 0; transition: opacity .2s linear; } </style> </head> <body> <label> <span>お名前</span> <input type="text" placeholder="山田 太郎" id="form-name" /> </label> <label> <span>メールアドレス</span> <input type="text" placeholder="xxx@example.com" id="form-mail" /> </label> <label> <span>問い合わせ内容</span> <textarea id="form-text"></textarea> </label> <div style="margin: 16px;"> <button onclick="submit()">送信する</button> </div> <div id="mask"> <div>送信しました</div> </div> <script> function submit() { const name = document.querySelector('#form-name') const mail = document.querySelector('#form-mail') const text = document.querySelector('#form-text') if (!name.value) name.style.borderColor = '#f00' if (!mail.value) mail.style.borderColor = '#f00' if (!text.value) text.style.borderColor = '#f00' if (!name.value || !mail.value || !text.value) { return } fetch('ここにURL', { method: 'POST', mode: 'no-cors', cache: 'no-cache', headers: { 'Content-Type': 'application/json', }, body: JSON.stringify({ name: name.value, mail: mail.value, text: text.value, }) }).then(() => { const mask = document.querySelector('#mask') mask.style.display = 'flex' setTimeout(() => { mask.style.opacity = '1' }, 0) }) } </script> </body> </html>
試したこと
javascriptの本などを読んだ。
https://tonari-it.com/profile/
この方のかいたサイトで色々勉強した。
補足情報(FW/ツールのバージョンなど)
macbook pro 16in
あなたの回答
tips
プレビュー