使用 Javascript 验证传递 PHP 电子邮件的复选框数组

Question

我有一个包含两个复选框数组的表单，我需要将其传递给 PHP 电子邮件脚本。表单数据在发送到 PHP 脚本之前通过 javascript 函数进行验证...我正在努力将数组放入我的表单数据中，这里是我的复选框数组之一

                 <div class="choice-group">
                        <div class="row">
                            <div class="col-md-4">
                                <div class="choice">
                                    <input type="checkbox" id="low" name="budgetvar[]" value="low">
                                    <label for="low">Low Cost</label>
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="choice">
                                    <input type="checkbox" id="medium" name="budgetvar[]" value="medium">
                                    <label for="medium">Medium Range</label>
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="choice">
                                    <input type="checkbox" id="premuim" name="budgetvar[]" value="premuim">
                                    <label for="premuim">Premium Range</label>
                                </div>
                            </div>

                        </div>
                    </div>

这是我的 Javascript formData

formData = {
            'firstname': $('input[name=firstname]').val(),
            'lastname': $('input[name=lastname]').val(),
            'phone': $('input[name=phone]').val(),
            'email': $('input[name=email]').val(),
            'consent': $('input:checkbox[name=consent]').is(':checked'),
            'budgetvar': $('input:checkbox[name=budgetvar]').val(),
            'optionsvar': $('input:checkbox[name=optionsvar]').val(),
            'message': $('textarea[name=message]').val()

        };

这是我的 .ajax 代码

$.ajax({
            url: "includes/mail/mail.php",
            type: "POST",
            data: formData,
            success: function(data, textStatus, jqXHR) {

                $('#status').text(data.message);
                if (data.code) //If mail was sent successfully, reset the form.
                    $('#contact-form').closest('form').find("input[type=text], textarea").val("");
            },
            error: function(jqXHR, textStatus, errorThrown) {
                $('#status').text(jqXHR);
            }
        });

然后我希望在我的 PHP 脚本中获取变量，如下所示

$budget = implode(', ', $_POST['budgetvar']);

任何关于如何将这些值放入数组中的帮助，我可以通过 php 电子邮件使用，这将是一个巨大的帮助！我在这里看过，但我似乎找不到任何我可以尝试和操作来解决我的问题的东西。这个相对较新的如此复杂的解决方案似乎让我有点头疼

提前致谢！

Answer 1

只需使用内置的 FormData 对象即可收集所有数据：

formData = new FormData( document.querySelector("form") );

浏览器可以为您完成所有收集工作。您不需要一个一个地挑出每个表单控件。

如果您设置使用 .ajax 发送，请确保您设置 processData: false; contentType: false 以停止 jQuery 试图变得聪明（这将破坏 XMLHttpRequest 的自然聪明）。

如果您真的想手动执行此操作，则需要：

找到所有 checked 输入（使用他们的真名，最后有一个 []）
获取他们的值
将它们放入数组中

例如

'budgetvar': $('input[name="budgetvar[]"]:checked').map(
    (index, element) => element.value
 ).get()

使用 Javascript 验证传递 PHP 电子邮件的复选框数组

Passing checkbox array for PHP email using Javascript validation

javascript

php

arrays

checkbox

contact-form