Get all form elements and irregular characters - php

Question

I have a form that can have any number of elements. Each element has a few characteristics. How can i get all the form's data into a url for ajax posting?
the variable id is the id of the given item.
Item 1
<input type='text' name='<?php echo $id . "['name']";?>' id='i_<?php echo $id . "['name']";?>'>
<input type='text' name='<?php echo $id . "['size']";?>' id='i_<?php echo $id . "['size']";?>'>
Item 2
<input type='text' name='<?php echo $id . "['name']";?>' id='i_<?php echo $id . "['name']";?>'>
<input type='text' name='<?php echo $id . "['size']";?>' id='i_<?php echo $id . "['size']";?>'>
Item 3
<input type='text' name='<?php echo $id . "['name']";?>' id='i_<?php echo $id . "['name']";?>'>
<input type='text' name='<?php echo $id . "['size']";?>' id='i_<?php echo $id . "['size']";?>'>
if i do
var inputs = $('#formName :input');
var data = "";
inputs.each(function() {
data += this.name+"="+$(this).val()+"&";
});
the brackets in the identifier mess everything all up. I know im am going about this incorrectly. What should i be doing?
if i do serialize the same thing occurs. I know its not ideal to use brackets in a element id, but how else can i associate a few characteristics of each item to the id?
Here is my rendered form:
<form name='formName' id='formName' action='#'>
<ul id="sortable">
<li class="ui-state-default" id='201817'>
<input type='button' class='removeItem' value='remove'>
<input type='text' name='201817['name']' id='a_201817['name']' value='hat'>
<input type='text' name='201817['size']' id='a_201817['size']' value='small'>
</li>
<li class="ui-state-default" id='501817'>
<input type='button' class='removeItem' value='remove'>
<input type='text' name='501817['name']' id='a_501817['name']' value='shirt'>
<input type='text' name='501817['size']' id='a_501817['size']' value='small'>
</li>
<li class="ui-state-default" id='522227'>
<input type='button' class='removeItem' value='remove'>
<input type='text' name='522227['name']' id='a_522227['name']' value='shirtB'>
<input type='text' name='522227['size']' id='a_522227['size']' value='Large'>
</li>
</ul>
</form>

Answer 1

You can use form.serialize it will consider all :input fields. Also remember that serialize will consider the element name and not the id.
So Try:
var data = $('#formName').serialize();