jQuery .serialize() for post?

Question

I am doing an ajax request through post that contains a forms variables.

the data for the ajax request looks like

data : {
  somevar1: 'someval1',
  somevar2: 'someval2',
  somevar3: 'someval3',
  somevar4: 'someval4',
  form:     FORMDATA
}

as you can see, as well as the basic form data I am also passing through some other data.

this means that I cannot use jquery .serialize()

I am wanting to end up with something that I can send through so on the other side I can just do

$_POST['form']['fieldname']

is there a built in function do do this?

or what would I need to do to create one?

the possibility of running a function on the form that does something like

function postArray(form){
  var data = {};
  var name, value = null;
  $(form).children('textarea, input, select'){
    name = this.name;
    data.name = $(this).val();
  }
  return data;
}

over the form could work.

and having

data : {
  somevar1: 'someval1',
  somevar2: 'someval2',
  somevar3: 'someval3',
  somevar4: 'someval4',
  form:     postArray(form)
}

would it work?

---

I could use .serializeArray(); But on the other side I get

Array
(
  [0] => Array
    (
      [name] => name1
      [value] => val1
    ),
  [1] => Array
    (
      [name] => name2
      [value] => val2
    )
  ...
  [8] => Array
    (
      [name] => name8
      [value] => val8
    )
)

Which is close, but that requires me to either
a: loop over the array and convert it to what I want
b: every time i use it loop over it to find the right key

Answer 1

    Try This:
        <?php 
        /*
         * As a Class File your-class-file.php
         * Decode jQuery Serialize Post String For PHP
         */
         class PHP_Serialize {
         function Decode_Serialize($QUERY_STRING) {
                  /*
                   * Decode form.serelize() jQuery Post String
                   * Return like $_POST['Form_Input_Name or ID']
                   */
                  $a = explode('&', $QUERY_STRING);
                  $i = 0;
                  $store = array();
                  while ($i < count($a)) {
                      $b = explode('=', $a[$i]);
                      $array_name = htmlspecialchars(urldecode($b[0]));
                      $array_value = htmlspecialchars(urldecode($b[1]));
                      $store[$array_name] = $array_value;
                      $i++;
                  }
                   /*
                    * Convert Array as an Object
                    * return(object)$store; 
                    * Use ........Object->Form_Input_Name or ID
                    * or
                    * Use as An Array .........$var["Form_Input_Name or ID"]
                    */
                  return $store;
              }
         }
        ?>
        <?php 
        /*
         * How to USE:
         * In Your PHP File (your-file.php)
         * Include Class File like include('your-class-file.php');
         * $Decode = new PHP_Serialize();
         * Use Function Like This $_POST = $Decode->Decode_Serialize($_POST['Query_String']);
         */

        /*
         * Demo HERE
         * you-file.php
         */
        include('your-class-file.php');
        $Decode = new PHP_Serialize();
        $_POST = $Decode->Decode_Serialize($_POST['Query_String']);
        /* Decode jQuery Serlize String AS a PHP Function if you not making Class file */
        $_POST = Decode_Serialize($_POST['Query_String']);
        /* Use POST String in your mySQL Statement Like This*/
        mysql_query("SELECT * FROM Table WHERE COMPANY_NAME = '".$_POST['COMPANY_NAME']."'");


        /*
         * Here is Your form PHP File
         */

        ?>
        <form action="" method="post" id="your-form-id" name="your-form-id">
        <label for="COMPANY_NAME">Company Name:</label>
        <input type="text" name="COMPANY_NAME" id="COMPANY_NAME"/>
        <label for="COMPANY_EMAIL">Company Email:</label>
        <input type="text" name="COMPANY_EMAIL" id="COMPANY_EMAIL"/>
        <input type="button" name="submit" id="submit" value="submit"/>
        </form>


        <script>
        $(document).ready(function() {
            $('#submit').click(function(){

                var Post_String = $('#your-form-id').serialize();
                $.ajax({
                type    :   'POST',
                url     :   'your-file.php',
                data    :   {Query_String:Post_String},
                success :   function(return_value){/* On Success you jQuery Code Here*/}
                });

            });

        });
        </script>

Answer 2

You can encode your form data as JSON using serializeArray and JSON.stringify.

serializeArray gives you an array like so:

[
  {
    name: a
    value: 1
  },
  {
    name: b
    value: 2
  }
]

so you would not be able to access the data on the server side with $data['fieldname']. To convert the array to an object (so that you could access the data like you want to), have a look at Convert form data to JavaScript object with jQuery.

Of course you can also just use your own function (which seems to do something similar if you fix the errors^‡), but you still have to use JSON.stringify:

data : {
  somevar1: 'someval1',
  somevar2: 'someval2',
  somevar3: 'someval3',
  somevar4: 'someval4',
  form:     JSON.stringify(postArray(form))
}

In your PHP script, you can then use json_decode to get the form data:

$form_data = json_decode($_POST['form']);

---

‡ Here is a fixed version (updated from you comment, don't use for...in to loop over arrays):

function postArray(form){ 
    var data = {}; 
    form = $(form).serializeArray(); 
    for(var i = form.length; i--; ) {
        data[form[i].name] = form[i].value;
    }
    return data; 
}

If you want to fix it for elements with [] in the name, you have to process those elements manually and put them in an array:

for(var i = form.length; i--; )
    var name = form[i].name;
    var value = form[i].value;
    var index = name.indexOf(`[]`);
    if( index > -1) {
        name = name.substring(0,index);
        if(!(name in data) {
            data[name] = [];
        }
        data[name].push(value);
    }
    else {
        data[name] = value;
    }
}    

but this assumes that you don't have field names like field and field[].