时间戳

首页 > 解决方案 > 使用 ajax 时提交的“未定义”数据

javascript - 使用 ajax 时提交的“未定义”数据

问题描述

我正在使用 HTML 表单将数据发送到谷歌表格，效果很好。但是当我添加 ajax 代码时，发送到谷歌工作表的数据总是“未定义”，删除它会工作的代码但它显示代码真的很难看，所以我想使用 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>

我不知道代码，我都在网络上使用教程。非常感谢您的帮助。

标签： javascripthtmlajax

解决方案

您忘记在ID表单中添加一个。您的脚本正在尝试test-form使用此函数序列化带有 id 的表单：

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>

推荐阅读