Skip to content

Instantly share code, notes, and snippets.

View Kazuki-tam's full-sized avatar

Kazuki-tam Kazuki-tam

View GitHub Profile
@Kazuki-tam
Kazuki-tam / firebase-form-TS
Last active May 5, 2020 14:28
firebase-form sample code2
"use strict";
// Firebase 初期化
import * as firebase from "firebase";
const config = {
apiKey: "api-key",
authDomain: "project-id.firebaseapp.com",
databaseURL: "https://project-id.firebaseio.com",
projectId: "project-id",
storageBucket: "project-id.appspot.com",
@Kazuki-tam
Kazuki-tam / firebase-form-html
Created May 5, 2020 06:00
firebase-form sample code
<body>
<main>
<div>
<h1>問い合わせフォーム</h1>
<div>
<form id="contactForm" action="">
<div>
<label for="name">お名前を入力してください</label>
<input id="name" type="text">
</div>
function sendForm(e){
// 件名
var subject = "問い合わせが送信されました!";
// 本文
var body = "以下のお問合せがありましたのでご確認ください。";
// メール送信先
var to = "sample@example.com";
var itemResponses = e.response.getItemResponses();
for (var i = 0; i < itemResponses.length; i++) {
function sendForm(e){
// 件名
var subject = "問い合わせが送信されました!";
// 本文
var body = "以下のお問合せがありましたのでご確認ください。";
// メール送信先
var to = "sample@example.com";
var itemResponses = e.response.getItemResponses();
for (var i = 0; i < itemResponses.length; i++) {
@Kazuki-tam
Kazuki-tam / gist:739d90f7d7c13f4d2de4775ec39649fc
Last active March 7, 2020 15:28
google-form-custom-ajax-vue
import Vue from "vue";
import axios from "axios";
new Vue({
el: "#postForm",
data: {
// フォームの表示
showForm: true,
// お問い合わせ内容
contactType: "",
<div class="p-formArea" id="postForm">
<form class="p-form" v-on:submit.prevent="submit" v-if="showForm">
<div class="p-formGroup__select u-mb20">
<label class="u-color-main" for="contactType">お問合せ内容</label>
<select id="contactType" v-model="contactType">
<option value="Webサイト構築">Webサイト構築</option>
<option value="SEO改善">SEO改善</option>
<option value="SNS運用">SNS運用</option>
<option value="アプリ開発">アプリ開発</option>
<option value="その他">その他</option>
<!-- デフォルトの入力フィールド -->
<label for="LastName" class="label--hidden">{{ 'customer.register.last_name' | t }}</label>
<input type="text" name="customer[last_name]" id="LastName" placeholder="{{ 'customer.register.last_name' | t }}"
{% if form.last_name %}value="{{ form.last_name }}" {% endif %} autocapitalize="words">
<label for="FirstName" class="label--hidden">{{ 'customer.register.first_name' | t }}</label>
<input type="text" name="customer[first_name]" id="FirstName" placeholder="{{ 'customer.register.first_name' | t }}"
{% if form.first_name %}value="{{ form.first_name }}" {% endif %} autocapitalize="words" autofocus>
<label for="Email" class="label--hidden">{{ 'customer.register.email' | t }}</label>
{% form 'create_customer' %}
{{ form.errors | default_errors }}
<!-- デフォルトの入力フィールド -->
<label for="LastName" class="label--hidden">{{ 'customer.register.last_name' | t }}</label>
<input type="text" name="customer[last_name]" id="LastName" placeholder="{{ 'customer.register.last_name' | t }}"
{% if form.last_name %}value="{{ form.last_name }}" {% endif %} autocapitalize="words">
<label for="FirstName" class="label--hidden">{{ 'customer.register.first_name' | t }}</label>
<input type="text" name="customer[first_name]" id="FirstName" placeholder="{{ 'customer.register.first_name' | t }}"
<script type="text/javascript">
var submitted = false;
var currentURL = window.location.href;
</script>
<iframe name="hidden_iframe" id="hidden_iframe" style="display:none;" onload="if(submitted) {window.location=currentURL + 'thanks.html';}"></iframe>
<form class="p-form" action="https://docs.google.com/forms/(Googleフォームからコピペしてください)" target="hidden_iframe" onsubmit="submitted=true;">
<!-- お問い合わせ内容 セレクトボックス -->
<div class="p-formGroup p-formGroup__select u-mb20">
<form class="p-form" action="https://docs.google.com/forms/(Googleフォームからコピペしてください)">
<!-- お問い合わせ内容 セレクトボックス -->
<div class="p-formGroup p-formGroup__select u-mb20">
<label for="contactType">お問い合わせ内容</label>
<select name="entry.(Googleフォームからコピペしてください)" id="contactType">
<option data-value="Webサイト構築" value="Webサイト構築">Webサイト構築</option>
<option data-value="SEO改善" value="SEO改善">SEO改善</option>
<option data-value="SNS運用" value="SNS運用">SNS運用</option>
<option data-value="アプリ開発" value="アプリ開発">アプリ開発</option>
<option data-value="その他" value="その他">その他</option>