Форма отправки должна отображать сообщение после успешной отправки в Google Sheets - PullRequest
Новая
       35

Форма отправки должна отображать сообщение после успешной отправки в Google Sheets

0 голосов
/ 01 июля 2019

Я пытаюсь отправить форму в Google Sheets.Этот шаг успешен, и я получаю все числа в листе.Теперь я хочу отобразить сообщение об успешном завершении после отправки формы и получения результата из Google Sheets.Как мне это сделать?

Я пробовал разные сообщения в javascript и ajax, но не очень разбираюсь в этом.Я показал мой код ниже, чтобы вы могли на него посмотреть. 

<form name="submit-to-google-sheet">
                          <select class="form-control custom-form" name="country_code" id="country_code">
                            <option name="country_code" value="+91">India 91</option>
                            <option name="country_code" value="+93">Afghanistan 93</option>
                          </select>
                        </div>
                      </div>
                      <div class="row">
                        <div class="form-group spec-col col-md-8 col-lg-8 col-sm-12">
                          <input type="text" class="form-control custom-form" id="phone_no" name="phone_no" placeholder="Enter the Number">
                        </div>
                    </div>
                      <button class="btn btn-submit" id="submit" type="submit">Submit</button>
                      </div>
                    </form>

Для отправки контента в Google Sheets, вот код 

<script>
      const scriptURL = 'GOOGLE SHEETS URL'
      const form = document.forms['submit-to-google-sheet']

      form.addEventListener('submit', e => {
        e.preventDefault()
        fetch(scriptURL, { method: 'POST', body: new FormData(form)})
          .then(response => console.log('Success!', response))
          .catch(error => console.error('Error!', error.message))
      })
    </script>

После успешного заполнения формыЯ вижу сообщение об успехе в консоли.Вместо этого я хочу показать простую строку из одного слова в HTML, это большое спасибо.Ваша отправка будет успешной, как только ответ от Google Sheets будет в порядке, и скройте форму.

Редактировать: Ссылка на остальную часть кода приведена здесь: https://github.com/jamiewilson/form-to-google-sheets

Ответы [ 2 ]

1 голос
/ 01 июля 2019

Нажмите кнопку и создайте пустое ответное сообщение

тег, подобный этому 

<button class="btn btn-submit" id="submit" type="submit">Submit</button>
<p id="response_message"></p>

Теперь в скриптах сделайте следующее изменение в функции выборки: 

form.addEventListener('submit', e => {
    e.preventDefault()
    var response_message = document.getElementById("response_message");
    fetch(scriptURL, { method: 'POST', body: new FormData(form)})
      .then(response => response_message.innerHTML = "Success!")
      .catch(error => response_message.innerHTML = "Error!")
  })
0 голосов
/ 01 июля 2019

Если вы используете форму Google для отправки данных в Google Sheet, в настройках форм есть настройка, в которой вы можете отобразить ответ при отправке. Код не нужен.

...