cakePHP+JQueryでajaxを使ってFormの内容をPOSTしてみた。

最新情報！！！！
新しく修正した記事書きました！！！
cakePHP+JQueryでajaxを使ってFormの内容をPOSTしてみた。その３(修正版)

cakePHP使っているんでAjaxだろうがpostしたときは$this->dataで受け取りたいなーとか思ってました。
data[Post][title]とかいうformの名前にしておけばいいといえばいいけど、Securityコンポーネントつかっているとだめだよねって話になりますよね。

んで、いちいち全部のinputタグのIDからデータとってくるのとかめんどいなーと悩んだ訳ですが・・・
よく考えたら、formのデータを全部もってくればいいってことに気づきました。

ってことでこんな感じに書いてみました。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22



<?php $this->Html->scriptStart(array('inline' => false))?>
$(function(){
	$('form').submit(function(){
		var postData = {};
		$('form').find(':input').each(function(){
			postData[$(this).attr('name')] = $(this).val();
		});
		$.post('/posts/add',postData,taskRender);

		return false;
	});
});
<?php $this->Html->scriptEnd()?>
<fieldset>
<legend><?php __('Add'); ?></legend>
<?php echo $this->Form->create('Post');?>
<?php echo $this->Form->input('title');?>
<?php echo $this->Form->input('name');?>
<?php echo $this->Form->input('description');?>
<?php echo $this->Form->end('登録');?>
</fieldset>

こうしておけば、Formの内容全部がAjax使ってPOSTされますね。

※追記2011/11/17
上記のJavaScriptだとselectやradio等の値を正しく取得できないのでコチラの記事を参考にしてください。