PHP $_POST content in form of array

Question

The following code generates the input fields, each field has some hidden inputs. I want to post these generated fields using the $_POST form method. On $_POST I want to receive (or arrange) all inputs of each field in a grouped form, for example like this:

1 => array(
    'type' => 'text',
    'name' => '',
    'label' => ''
),

2 => array(
    'type' => 'radio',
    'name' => '',
    'label' => ''
)
..
..

My question is that, how can I receive the data in above format?

Here's the code that I am using to generate the fields:

$('#text').on('click', function(e){
  input_html = '<div class="field">' +
             '<label>Label</label>' +
             '<input type="text" value="">' +
             '<input type="hidden" name="type" value="input">' +
             '<input type="hidden" name="name" value="">' +
             '<input type="hidden" name="label" value="">' +
             '</div>';
       
       $('#fields').append(input_html);
})

$('#radio').on('click', function(e){
  input_radio = '<div class="field">' +
              '<label>Radio</label>' +
              '<input type="radio" value="">' +
              '<input type="hidden" name="type" value="radio">' +
              '<input type="hidden" name="name" value="">' +
              '<input type="hidden" name="label" value="">' +
              '</div>';
        
        $('#fields').append(input_radio);
        
})

body {
  padding: 20px;
  font-family: Helvetica;
}



button {
  background: #0084ff;
  border: none;
  border-radius: 5px;
  padding: 8px 14px;
  font-size: 15px;
  color: #fff;
  cursor: pointer;
}

.field {
  margin-bottom: 10px;
}

label {
  margin-right: 10px;
}

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

 
 <div id="fields">  
      
  
  </div>
  
    
  <button id="text">Add text field</button>
  <button id="radio">Add radio field</button>
  
    
</div>

Answer 1

You can use this like- name="input_filed_name[]" this will return an array. According to your codes:

$('#text').on('click', function(e){
  input_html = '<div class="field">' +
             '<label>Label</label>' +
             '<input type="text" value="">' +
             '<input type="hidden" name="type[]" value="input">' +
             '<input type="hidden" name="name[]" value="">' +
             '<input type="hidden" name="label[]" value="">' +
             '</div>';
       
       $('#fields').append(input_html);
})

$('#radio').on('click', function(e){
  input_radio = '<div class="field">' +
              '<label>Radio</label>' +
              '<input type="radio" value="">' +
              '<input type="hidden" name="type[]" value="radio">' +
              '<input type="hidden" name="name[]" value="">' +
              '<input type="hidden" name="label[]" value="">' +
              '</div>';
        
        $('#fields').append(input_radio);
        
})