Trent Richardson

I’ve ventured into new waters lately with CakePHP, which may I add is a splendid framework. One thing I quickly ran across is how Cake may handle forms with it’s form helpers. Using the helpers it will write your html for you, but doing so it uses arrays in its form fields. This is a first for me dealing with jQuery and these arrays. If you’re confused about what I’m talking about take a look:

<input type="text" name="data[modelName][fieldName]" id="modelField" value="" />

By generating the form fields this way Cake can instantly figure out what field this is and where it goes. The problem comes in when you need to do a few fancy ajax additions and pass this puppy into $.post(). With this function jQuery is expecting a one dimensional object, there is no need to layer your object to match this array. So that being said I would create an object like the following and pass it in:

//build your object using strings as the key names
var obj = {
	'data[modelName][fieldName1]' : 'asfasd',
	'data[modelName][fieldName2]' : 123,
	'data[modelName][fieldName3]' : 'bla bla bla'
};

//make the ajax post
$.post('myurl/whatever/', obj, function(data,textStatus){
	$.prompt('item sent!');
});

As you can see you treat the entire html name array as a string within your javascript object. On the retrieving end php will then know exactly what to do with it. Not going to lie this stumped me at first, but after a few trial and error attempts it proved to be fairly simple.

And in case you’re wondering I was using this with Impromptu and it didn’t like the field names when gathering them like this(really the jQuery selectors I believe, but I will need to do more digging). Hope this helps someone as much as it did me!

Related posts:

1. Key Value Pairs of Form Values with jQuery
2. Meet jQuery iFramer
3. Impromptu: An Ajax Form Framework
4. Handling TimeZones in CakePHP
5. A Nice, Clean jQuery iFramer Example