javascript - 如何修复表单控件中的空数组而不使用 mySql(PHP、AJAX、JQuery、JS)

标签 javascript php jquery ajax forms

我正在尝试为非营利组织创建 PHP 表单,并希望使用 PHPMailer 通过 SMTP 发送电子邮件。 我的问题是表单包含一个动态表,我想在其中通过 Ajax 和 JSON 存储/发送数据到 .php 文件,但它不会用值填充数组(即使我输入 $(tr ).find('td:eq(0)').val()。Ajax数据还包含两个加法值。 另外,如果我尝试对下面的代码进行 json_decode,PHP 就会崩溃。

  1. 我尝试通过变量获取数据,并且它有效。
  2. 我尝试将它们收集在一个字符串中,然后转换为 JSON,但没有成功。(PHP 不发送任何内容,也不发送错误反馈)
  3. 现在我正在尝试从行创建多个数组。但像2.它不起作用

HTML 正文:

<html>....
<input id="name" class="form-control" required>
<input type="email" id="email"class="form-control" required>
<table id="dynamic_field">
  <tr>
   <td>
    <textarea id="value1" class="form-control" required></textarea></td>
   <td>
    <textarea id="value2" class="form-control" required></textarea></td>
.....
</tr></table>
<input type="button" onclick="sendEmail()" value="Send &arr" class="btn btn-primary">

脚本:

function sendEmail() {
  var name = $("#name");
  var email = $("#email");
  var value1 = $("#value1");
  var value2 = $("#value2");
 ....  
  var TableData;
  TableData = JSON.stringify(storeTblValues());

  $.ajax({
          url: 'sendEmail.php',
          method: 'POST',
          dataType: 'json',
          data: {
                 name: name.val(),
                 email: email.val(),
                 value1: value1.val(),
                 value2: value2.val(),
                 TableData: TableData
   }, success:...

function storeTblValues(){
 var TableData = new Array();
 $("#dynamic_field tr").each(function (row, tr) {
   TableData[row] = {"value1": $(tr).find('td:eq(0)').text() , "value2": $(tr).find('td:eq(1)').text() , ......}
  ;});return TableData;
;}

我期望数组 TableData 的输出为 [{"value1":"Whatever in Value 1","value2":"Whatever in Value 2 ",... .}] ,但我从这个字符串中读取的是 [{"value1":"\n ","value2":"\n ",...}]

最佳答案

使用$('form').serializeArray()

示例:

$('button').click(function () {
  var formData = $('form').serializeArray();
  console.log(formData);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
  <input type="text" name="your-name" placeholder="name">
  <textarea name="your-text" placeholder="text"></textarea>
  <button type="button">Submit</button>
</form>

您也无法转换此数组:

var searchParams = new URLSearchParams("your-name=value1&your-text=value2");
var result = {};
// Display the key/value pairs
for(var pair of searchParams.entries()) {
   result[pair[0]] = pair[1]
}
console.log(result);

关于javascript - 如何修复表单控件中的空数组而不使用 mySql(PHP、AJAX、JQuery、JS),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57430021/

相关文章:

php - 如何使用PHP向MySQL添加数据

php - $_SERVER 可以在 PHP 中伪造吗?

javascript - 如果另一个 div 小于指定大小,则显示一个 div

javascript - 从 Web 服务器的 HTML 资源中播放 FLAC

javascript - 使用输入在 JavaScript 中分类

javascript - 如何使用javascript获取数组的键?

javascript - 使用 document.getElementById 替换 insideHTML 时出现意外行为

JavaScript 与 jQuery 数学行为?

jquery - 使用滚动事件链接 CSS3 动画/变换

javascript - 如果我链接我的 css,我网站内的谷歌地图不起作用