将多个 PHP 变量放入 Javascript 数组

Posted 2023-02-24

【中文标题】将多个 PHP 变量放入 Javascript 数组

【英文标题】：Getting multiple PHP variables into a Javascript array

【发布时间】：2017-09-19 11:44:44

【问题描述】：

在我的表单中，我有很多 input type="radio" 字段，它们是由 php 循环代码生成的。每个都有自己的 name，它是一个数组。这些输入字段的值通过 AJAX 处理。问题是我不确定如何在 javascript 或 jQuery 中读取这些输入字段的值。

这是我的表单代码（简化）。

<form id="_user_roles_form" method="post" class="form-horizontal">

    <p><strong>Manager</strong></p>

    <div class="form-group row">
        <label class="col-lg-6 control-label">Register Companies</label>
        <div class="col-lg-6">
            <div class="btn-group" data-toggle="buttons">
                <label class="btn btn-default active">
                    <input type="radio" name="_data[Manager][publish_companies]" value="1"/> True
                </label>
                <label class="btn btn-default ">
                    <input type="radio" name="_data[Manager][publish_companies]" value="0"/> False
                </label>
            </div>
        </div>
    </div>

    <div class="form-group row">
        <label class="col-lg-6 control-label">Edit Companies</label>
        <div class="col-lg-6">
            <div class="btn-group" data-toggle="buttons">
                <label class="btn btn-default active">
                    <input type="radio" name="_data[Manager][edit_companies]" value="1"/> True
                </label>
                <label class="btn btn-default ">
                    <input type="radio" name="_data[Manager][edit_companies]" value="0"/> False
                </label>
            </div>
        </div>
    </div>

    <div class="form-group row">
        <label class="col-lg-6 control-label">Edit Others Companies</label>
        <div class="col-lg-6">
            <div class="btn-group" data-toggle="buttons">
                <label class="btn btn-default active">
                    <input type="radio" name="_data[Manager][edit_others_companies]" value="1"/> True
                </label>
                <label class="btn btn-default ">
                    <input type="radio" name="_data[Manager][edit_others_companies]" value="0"/> False
                </label>
            </div>
        </div>
    </div>

    <div class="form-group row">
        <label class="col-lg-6 control-label">Edit Customers</label>
        <div class="col-lg-6">
            <div class="btn-group" data-toggle="buttons">
                <label class="btn btn-default ">
                    <input type="radio" name="_data[Employee][edit_customers]" value="1"/> True
                </label>
                <label class="btn btn-default active">
                    <input type="radio" name="_data[Employee][edit_customers]" value="0"/> False
                </label>
            </div>
        </div>
    </div>

    <div class="form-group row">
        <label class="col-lg-6 control-label">Edit Others Customers</label>
        <div class="col-lg-6">
            <div class="btn-group" data-toggle="buttons">
                <label class="btn btn-default ">
                    <input type="radio" name="_data[Employee][edit_others_customers]" value="1"/> True
                </label>
                <label class="btn btn-default active">
                    <input type="radio" name="_data[Employee][edit_others_customers]" value="0"/> False
                </label>
            </div>
        </div>
    </div>

    <div class="form-group row">
        <label class="col-lg-6 control-label">Delete Customers</label>
        <div class="col-lg-6">
            <div class="btn-group" data-toggle="buttons">
                <label class="btn btn-default ">
                    <input type="radio" name="_data[Employee][delete_customers]" value="1"/> True
                </label>
                <label class="btn btn-default active">
                    <input type="radio" name="_data[Employee][delete_customers]" value="0"/> False
                </label>
            </div>
        </div>
    </div>

     <div class="form-group">
         <div class="col-lg-12">
             <button type="submit" class="btn btn-default">Confirm</button>
         </div>
     </div>

</form>

在 PHP 中，我可以使用 _data[][] 作为数组变量，但我需要将其读入 javascript 变量中，以便将其传递给 AJAX。通常我是通过 jQuery('#_ID').val() 来做的，但在这种情况下它不起作用。我觉得我需要声明一个javascript数组变量，找到所有（和每个）带有type="radio" & name="_data-*"的html元素，并将找到的每个推送元素的名称和值到数组中。我不确定如何解决这个问题。

我们非常感谢您的帮助。谢谢。

【问题讨论】：

所以您想通过 ajax 以这种形式发送所有输入？

@David 是的，我想通过 Ajax 以这种形式发送所有输入。

【参考方案1】：

如果要发送所有值，请使用 serializeArray() 函数。

var formData = jQuery('#_user_roles_form').serializeArray();

如果您使用的是 WordPress，您可能还需要：

formData.push(name: 'action', value: 'yourAjaxAction'); 
// if you have set yourself up to use nonce
// formData.push(name: 'nonce_data', value: yourNonceValue );

jQuery.ajax(
     url         : ajaxUrl, // global ajax url
     type        : 'post',
     data        : formData,
     success     : function(data, textStatus, jqXHR) 
// etc etc

【讨论】：

像魅力一样工作！向 serializeArray() 和 Melissa Freeman 致敬！