使用ajax

时间:2019-07-05 12:36:43

标签: javascript html ajax

我正在使用HTML表单将数据发送到Google表格,效果很好。但是,当我添加Ajax代码时,发送到Google表格的数据始终是“未定义的”,请删除将起作用的代码,但此后它显示的代码确实很难看,所以我想使用Ajax。

$(document).ready(function() {
  var submit = $("button[type='submit']");
  submit.click(function() {
    var data = $('form#test-form').serialize();
    $.ajax({
      type: 'GET',
      url: 'https://script.google.com/macros/s/AKfycby8PCL7hef6N35QAEe7CcGWEVLeONJfy8ATXIsM5Sn7icTDMw8/exec',
      dataType: 'json',
      crossDomain: true,
      data: data,
      success: function(data) {
        if (data == 'false') {
          alert('Oopps! Đã có lỗi. Quý khách hãy thử lại hoặc liên hệ trực tiếp qua hotline nhé.');
        } else {
          alert('Đã tiếp nhận thành công! Cát Tiên sẽ liên hệ lại trong thời gian sớm nhất. Cám ơn quý khách');
        }

      }
    });
    return false;
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form action="https://script.google.com/macros/s/AKfycby8PCL7hef6N35QAEe7CcGWEVLeONJfy8ATXIsM5Sn7icTDMw8/exec" method="GET">
  <input type="text" name="SDT" id="ip2" placeholder=" SĐT hoặc Email">
  <button type="submit" id="submit-form" class="button">Nhận</button>
</form>

<script type="text/javascript">
</script>

我对代码一无所知,我都使用网络教程。非常感谢您的帮助。

1 个答案:

答案 0 :(得分:0)

您忘记在表单中添加ID。 您的脚本正在尝试使用以下功能对ID为test-form的表单进行序列化:

var data = $('form#test-form').serialize();

找不到表单,因为您忘记了将ID添加到表单中。

只需用以下内容替换表单的HTML:

<form 
id="test-form"
action="https://script.google.com/macros/s/AKfycby8PCL7hef6N35QAEe7CcGWEVLeONJfy8ATXIsM5Sn7icTDMw8/exec" method="GET">
<input type="text" name="SDT" id="ip2" placeholder=" SĐT hoặc Email"> 
<button type="submit"id="submit-form" class="button">Nhận</button>
</form>