How to get Array values from jquery-ajax formData to php

Question

I am trying to pass an input field which has its values to be in an array with some other input fields into PHP using jquery-Ajax formData, everything seems to work fine except that I am having problems with successfully passing the array values and I have tried a whole lot which without evident success.

firstly i tried SerialiseArray() method. Here is my code below

 <form>
 //other input field below...
  .
  .
  .
//this is the code to include my array which is in _categories-list.php
<div class="form-group">
<label for="artist">Select Categories </label>
<?php include('../_categories-list.php') ?>
</div>    </form>

  var Category = $('#categoriesList').serializeArray();
  $.each( Category,function(i,field){
  formData.append('categoriesList', field.value + "");
                               });
   $('.msg').text('Uploading in progress...');
         ajaxcall =       $.ajax({
                    url: 'page-videoFunc.php',
                    data: formData, 
                    processData: false,
                    contentType: false,
                    type: 'POST',});

This particular method I used only sends one value of the chosen options in the array. example:

//output: let's say the person chooses blues, hip-hop
hip-hop //will be the only value sent

I also tried another method similar

<form>
 //other input field below...
  .
  .
  .
//this is the code to include my array which is in _categories-list.php
<div class="form-group">
<label for="artist">Select Categories </label>
<?php include('../_categories-list.php') ?>
</div>  </form>

  var Category = $('#categoriesList').serializeArray();
  formData.append('categoriesList', Category);//note that code changes here from the above method used
   $('.msg').text('Uploading in progress...');
         ajaxcall =       $.ajax({
                    url: 'page-videoFunc.php',
                    data: formData, 
                    processData: false,
                    contentType: false,
                    type: 'POST',});

This one sends all the values of the array that is chosen but sends but as an object example:

//output
[object object] [object object]

And lastly, I tried this: serialize();

<form>
 //other input field below...
  .
  .
  .

//this is the code to include my array which is in _categories-list.php
<div class="form-group">
<label for="artist">Select Categories </label>
<?php include('../_categories-list.php') ?>
</div>  </form>

  var Category = $('#categoriesList').serialize(); //Note i used just serialize() here
  formData.append('categoriesList', Category);
   $('.msg').text('Uploading in progress...');
         ajaxcall =       $.ajax({
                    url: 'page-videoFunc.php',
                    data: formData, 
                    processData: false,
                    contentType: false,
                    type: 'POST',});

Which partially works and sends all the values but in a format i seem not to get a way to get the values out, example:

 //output
 categoriesList%5B%5D=blues&categoriesList%5B%5D=hip-hop

I don't know how to get only the values from the query strings in this method so I could put it into the database

Please help me provide a solution to any of the above method I am using, I have worked on this nearly 42 hours and its slowing down my project

Shivendra Singh · Accepted Answer · 2019-07-07 14:09:17Z

1

call the ajax like.

var Category = $('#categoriesList').serialize();
$.ajax({
                    url: 'page-videoFunc.php',
                    type: 'post',
                    data:{
                         action:'update_data',
                         form_data:Category 
                     },

});

In page-videoFunc.php file, parse the form_data using parse_str.

if($_POST['action'] =='update_data'){
parse_str($_POST['form_data'], $my_form_data);
echo "<pre>";
print_r($my_form_data);
}

edited Jul 7, 2019 at 14:09

answered Jul 7, 2019 at 14:03

Shivendra Singh

2,9731 gold badge13 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

GeniusGeek Over a year ago

hello Shivendra Singh, thanks for your response, please where is the variable $my_form_data coming from? and also are you considering that in your data part,data:{ action:'update_data', form_data:Category } i have formdata already which is the embediment of all the fields in the form and not just category,?

GeniusGeek Over a year ago

or can i do something like this: data:{ action:'update_data', form_data:Category, data:formData, } where formData is var formData = new FormData(); and also appended to other fields in the form

Shivendra Singh Over a year ago

Okay, :{ action:'update_data', form_data:Category } this a added for example. instead of Category you can use formdata. parse the form_data data in my_form_data. I added the link for parse_str check.

GeniusGeek Over a year ago

wow thanks man, it just worked, the last method is working now using the parse_str, though i have used it before but wasn't using it well, had to go through the parse_str manual, thanks once again.

GeniusGeek Over a year ago

I am having an issue with printing out all the values at the same time, using echo $output['arr'][0]; echo $output['arr'][1]; this is when i know how many values the user choses, but pratically in this scenerio i won't know, so how do i print out all values after using using parse_str.

|

GeniusGeek · Accepted Answer · 2019-07-07 15:09:56Z

0

After using parse_str to cut off added URL to serialized data, to get all values of the array, you should do this:

 parse_str($_POST['name'], $output);
  $x = $output["name"];
  foreach ($x as $key => $value) {
   echo $value;
      }

answered Jul 7, 2019 at 15:09

GeniusGeek

3437 silver badges16 bronze badges

Collectives™ on Stack Overflow

How to get Array values from jquery-ajax formData to php

2 Answers 2

7 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

7 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related