<!DOCTYPE html>
<html>

<head>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" />
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css" />
  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/css/toastr.min.css" />
  <link rel="stylesheet" href="style.css" />
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
  <script src="//cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.min.js"></script>
  <script src="script.js"></script>
</head>

<body>
  <div class="container">
    <div class="form-group">
      <label for="comment">Question:</label>
      <textarea type="text" id="question" class="form-control" name="question">Do Androids Dream of Electric Sheep?</textarea>
    </div>
    <div class="form-group">
      <label for="comment">Answer:</label>
      <input type="text" class="form-control" id="answer" name="answer" value="Electric What?" />
    </div>
    <div class="form-group">
    <button class="btn btn-info" type="submit" id="submit">Send It!</button>
    </div>
    <div class="form-group">
      <a href="https://drive.google.com/folderview?id=0B9Ny4eY76JvUfndHbGlueVB2X2t3aGNJaEt1eVRkdmpFVlc2a0lIWW5KNWNNVkgtY292bEk&usp=sharing" target="_blank">Сервер тут</a>
    </div>
  </div>

</body>

</html>
function submit() {
  var rq = $.ajax({
    type: 'POST',
    url: 'https://script.google.com/macros/s/AKfycbzPGdQ__DEgjxfEPnwcGifiH8aMMvFHFJXfHi8dn8AfoHuVMN4w/exec',
    data: $('#answer, #question').serialize()
  });
  rq.done(function(data) {
    toastr['success'](JSON.stringify(data), 'Успех');
    console.log('success', data);
  });
  rq.fail(function(err) {
    toastr['err'](JSON.stringify(err), 'Проблема на клиенте');
    console.log('error', err);
  });
}

$(function() {
  $('#submit').click(submit);
})
/* Styles go here */