ロード時にajaxフォームを送信

Question

私は各ajaxフォームを生成するページを各カメラに1つずつ持っています。送信時には、各カメラからの画像を含むdivがロードされます。私は彼らがロードするようにフォームを提出したいと思います。

これまでは、送信時にフォームがすでに実行していたアクションから、送信ボタンをajaxイベントにバインドするオンクリックイベントを除いたものを使用しました。

$(document).ready(function() { 
    $.ajax({data:$(".CameraContainer").closest("form").serialize(), 
     dataType:"html", 
     success:function (data, textStatus) {$("#ajaxPicture1").html(data);}, 
     type:"post", 
     url:"\/cameras\/ajaxPicture" 
    }); 

     return false;}); 

これらは両方とも、それぞれが独自のAjaxのdiv要素とCameraContainerのdivを持って、n個のカメラコンテナのために反復されています。ここでは

は、HTML（一部CakePHPのdivのスープは削除）

<div id="CameraContainer"> 

    <form action="/Cameras/ajaxPicture" id="CameraShowForm" method="post" accept-charset="utf-8"> 
     <input type="hidden" name="_method" value="POST" /> 
     <input type="hidden" name="data[Camera][camera]" label="Images:" value="CS011" id="CameraCamera" /> 
     <label for="datepicker_value">Date: </label><input name="data[Camera][date]" type="text" id="datepicker_value" value="12/13/2011 12:00:00" /> 
     <input type="hidden" name="data[Camera][count]" label="Images:" value="2" id="CameraCount" /> 
     <input id="submit-490507801" type="submit" value="Load Pictures" /> 
    </form> 
</div> 

<div id="ajaxPicture1" class="ajaxPicture"></div> 

とJavaScriptですフォームのために。現在のところ、<script>はループ内にありますが、ページの最後にロードできればよいでしょう。

これは私のフレームワークで生成されたコードから取られているため、完全に理解できません。私が望むのは、id CameraContainer（フォームはこの要素の中にあります）を持つ要素に最も近いものを取得し、このデータをシリアライズして、それを私のajax関数（/cameras/ajaxPicture）に送信することです。ただし、その関数に送信する配列は空です。したがって、この関数は結果を返しません。

特定の要素に最も近いAjaxフォームを取得し、コンテナdivにロードするにはどうすればよいですか？

Answer 1

あなたはとても#なく.

あなたはCameraContainerに近い要素を検索しないCameraContainerはidがある

$("#CameraContainer").find("form").serialize() 

1. 使用する必要があり、あなたは要素を検索していますCameraContainerにあるのでfind関数を使用する

私の見てくださいexample