Posting multi dimensional form via jquery to php

Question

i have a form. first 2 inputs are simply a customer ID and an address ID. Then the rest is a multidimensional form as the usuer can dynamically add more items.

<div class='invoice_object'>
    <input      name='item[1][quantity]'    type='text'  value=''/>
    <textarea   name='item[1][description]'     ></textarea>
    <input      name='item[1][unit_price]'  type='text'  value=''/>
    <input      name='item[1][amount]'      type='text'  value=''/>
</div>

ANother invoice object can be added with jquery and it would be like so:

    <div class='invoice_object'>
    <input      name='item[2][quantity]'    type='text'  value=''/>
    <textarea   name='item[2][description]'     ></textarea>
    <input      name='item[2][unit_price]'  type='text'  value=''/>
    <input      name='item[2][amount]'      type='text'  value=''/>
</div>

If i post it normally with a submit button then the $_POST variable will contain:

$_POST['customer']
$_POST['address']
$_POST['item'] {
                ['1'] {
                       ['quantity']
                       ['description']
                       ['unit_price']
                       ['amount']
                       }
                ['2'] {
                       ['quantity']
                       ['description']
                       ['unit_price']
                       ['amount']
                       }
                }

I've searched for hours and tried all sorts of versions or serialize and serializeArray.JSON decode etc It seems you can only send a string to php from jquery. Using JSON can get it to the php file but $_POST always ends up just having 1 value and its a string of all the data.

i figured there must be a way of doing it... without manually making a function that dissects the string acording to where the square brackets are.

i could do with some advice please. Thanx. But without panually dissecting

jquery

    var x = $('#new_invoice').serialize();

    $.post("script/new_invoice_script.php", {
                    x                       
                    }, function(data) {     
                    console.log (data);
                    });

`$(form).serialize();` and use ajax to send this serialized form — Serving Quarantine period, Feb 09 '17 at 21:06
Show your code that uses `serialize()`. If you're using it correctly, it should do what you want. Since it's not doing what you expect, you must be using it wrong, but we can't tell what you're doing wrong if you don't post it. — Barmar, Feb 09 '17 at 21:07
sorry uploaded now. i have tried different ways of writing and ive used serializeArray() @Anant — dragonvsphoenix, Feb 09 '17 at 21:12
@RiggsFolly Why did you use that dup? The problem is that he wrote `{ x }` instead of just `x` in the `$.post` argument. — Barmar, Feb 09 '17 at 21:27
`{ x }` is short for `{ x: x }`, which will put the serialized data in `$_POST['x']`. Just use `x` instead. — Barmar, Feb 09 '17 at 21:28

score 3 · Accepted Answer · answered Feb 09 '17 at 21:30

You shouldn't put x inside another object. It's already in the format necessary for the data argument to $.post.

var x = $('#new_invoice').serialize();
$.post("script/new_invoice_script.php", x, function(data) {
  console.log(data);
});

When you write { x } it's the ES6 shorthand for { x: x }. That puts the serialized input string into $_POST['x'].

score 0 · Answer 2 · answered Feb 09 '17 at 21:22

0

The .serialize() method creates a text string in standard URL-encoded notation. It can act on a jQuery object that has selected individual form controls, such as , , and : $( "input, textarea, select" ).serialize();

You need use .serializeArray()

answered Feb 09 '17 at 21:22

Максим Степанов

185
1
11

See the Dup for an answer – RiggsFolly Feb 09 '17 at 21:26

Posting multi dimensional form via jquery to php

2 Answers2