在加載時提交ajax表單

我有一個頁面生成n個Ajax表單，每個相機一個。在提交每個相機加載一個div與圖片。我想在提交表單時加載它們。在加載時提交ajax表單

到目前爲止，我已經從提交表單時所採取的操作中減去將提交按鈕綁定到ajax事件的單擊事件。

這裏的（一些CakePHP的DIV湯刪除）的HTML

<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：

$(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;});

這些都重複了N個攝像容器，每個人都有一個獨特的AJAX股利和CameraContainer DIV爲表格。目前，<script>位於循環內，但如果我可以在頁面的最後加載它會更好。

這是取自我的框架生成的代碼，所以我不完全理解它;我想要的（儘管它會）做的是從最接近的元素CameraContainer（表單在這個元素中），序列化這些數據並將其提交給我的ajax函數，它的位置是/cameras/ajaxPicture。但是它發送給該函數的數組是空的，因此該函數不會返回任何結果。

如何抓取並向給定元素提交最近的Ajax表單（並將其加載到容器div中）？

來源

2011-12-13 Ben Brocka

爲什麼要在頁面加載時提交表單文章？ – austincheney 2011-12-13 17:44:49

預先填充的表單，可根據時間從每個相機加載圖片，並設置默認時間。在頁面加載時，您會看到幾張表格以及來自每臺相機的幾張圖片作爲示例。我也可以做到服務器端，但我認爲這是最有意義的，並保持第一個圖像請求與所有其他圖像請求一樣。 – 2011-12-13 17:48:54

您應該使用

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

CameraContainer是一個ID，因此#，而不是一個.
你不要搜索，接近CameraContainer元素，你搜索一個元素，其在CameraContainer所以用find功能

看看我的example

來源

2011-12-13 17:56:37 noob

在加載時提交ajax表單

回答

相關問題