通过 AJAX 将多个HTML表单字段转换为PHP数组

iibxawm4 于 2023-09-29 发布在 PHP

关注(0)|答案(1)|浏览(119)

我需要帮助我有下面的HTML表单字段，我希望他们被发送到一个PHP页面的个人PHP数组。
HTML

<input class="form-control" type="date" onchange="reportSave()" name="testreportname[]">
<input class="form-control" type="date" onchange="reportSave()" name="testreportdate[]">
<input class="form-control" type="date" onchange="reportSave()" name="testreportissue[]">

JavaScript

<script>
    function reportSave() {
        //Test Report Name
        //get the data from test report name
        var testreport=document.getElementsByName('testreportname[]');
        var testreportdate=document.getElementsByName('testreportdate[]');
        var testreportissue=document.getElementsByName('testreportissue[]');
        var data1 = $(this).serializeArray();
            
        //for each item in the array
        for(key=0; key < testreport.length; key++)  {        
                    
        data1.push({
        testreport: $("#testreport").val(), testreportdate: $("#testreportdate").val(), testreportissue: $("#testreportissue").val(),
        });
        console.log("key: ", key)
        console.log(testreport)
        }
        
    //send to PHP via ajax
        $.ajax({
            type: "post",
            url: "draftsave.php",
            dataType: "json",
            data: data1,
            success: function(result) {
                console.log(result)
                }
            });
    }
</script>

PHP

<?php
$stestreport=$_POST['testreport'];
$stestreportdate=$_POST['testreportdate'];
$stestreportissue=$_POST['testreportissue'];

for($i=0;$i<count($stestreport);$i++)
        { code here, etc};
?>

编辑，删除已尝试的代码。

php

来源：https://stackoverflow.com/questions/77148797/multiple-html-form-fields-to-php-arrays-via-ajax

1条答案

按热度按时间

lhcgjxsq1#

jQuery提供了serialize()函数，它提供了一种非常简单的方法来从表单或特定的字段集合中获取所有数据，并将它们转换为form-url编码格式，如果您提交了常规表单（没有 AJAX ），它们通常会被传输。这是PHP识别的格式，并将自动转换为$_POST数组中的数据。
这个小演示展示了
a）serialize（）输出什么
B）使用类名选择您感兴趣的特定字段的方法（注意HTML中每个输入字段上的额外类）
c）一种更好的方式来处理“change”事件，使用选择器，而不是用onchange属性乱丢HTML。

$(".reportField").change(function() {
  var formFields = $(".reportField").serialize();
  console.log(formFields);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<input class="form-control reportField" type="date" name="testreportname[]">
<input class="form-control reportField" type="date" name="testreportdate[]">
<input class="form-control reportField" type="date" name="testreportissue[]">

因此，如果你想在 AJAX 中使用它，你最终会得到这样的结果：

$(".reportField").change(function() {
  var formFields = $(".reportField").serialize();

  $.ajax({
    type: "post",
    url: "draftsave.php",
    data: formFields,
    success: function(result) {
        console.log(result)
    }
  });
});

赞(0）回复(0）举报 2023-09-29

我来回答

通过 AJAX 将多个HTML表单字段转换为PHP数组

1条答案

相关问题

热门标签

最新问答