Obtenir plusieurs variables PHP dans un tableau Javascript

Question

Dans mon formulaire, j'ai beaucoup de input type = "radio" champs, qui sont générés par les codes de bouclage PHP. Chacun a son propre nom, qui est un tableau. Les valeurs de ces champs de saisie sont traitées via AJAX. Le problème est que je ne suis pas sûr de savoir comment lire les valeurs de ces champs de saisie dans Javascript ou jQuery.

Voici mon code pour le formulaire (simplifié).

<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> 

En PHP, je peux utiliser _data [] [] comme une variable de tableau, mais je dois lire dans une variable javascript afin que je puisse le transmettre à AJAX. Habituellement, je le fais par jQuery ('#_ ID'). Val(), mais dans ce cas, cela ne fonctionne pas. Je pense que j'ai besoin de déclarer une variable tableau javascript, trouver tous (et chacun) des éléments HTML avec type = "radio" & name = "_ data- *", et de pousser chacun des nom et valeur de l'élément trouvé dans le tableau. Je ne sais pas comment je peux résoudre ça.

Votre aide est grandement appréciée. Je vous remercie.

Answer 1

Si vous envoyez toutes les valeurs, utilisez la fonction serializeArray().

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

Si vous utilisez WordPress, vous aurez également besoin:

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