表單AJAX發送內部twitter引導模式（Symfony2）

在嘗試每個谷歌和stackoverflow的結果後，我決定要求你的幫助。表單AJAX發送內部twitter引導模式（Symfony2）

我正在構建一個Symfony2應用程序。在我的應用程序的每個視圖中，我都包含一個twitter引導模式元素，其中包含發送建議/問題郵件的表單。所以，從我的基礎樹枝模板，我包括這個隱藏的模式。

模式顯示/解除工作就好了。根據需要，Modal包含我的表單。

我想從這裏實現的是：AJAX提交表單，郵件在控制器中發送，對視圖的響應。有了這個響應是json，並且將模式的html更改爲「* dismiss_button *」+「發送電子郵件」或「有問題」的成功功能。

看起來相當簡單。那麼，在嘗試了大多數解決方案之後，我無法阻止表單提交。所以我決定保持它非常簡單。

這裏，模態代碼：

<!-- Modal --> 
<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
<div class="modal-header"> 
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
    <h3 id="myModalLabel">Send your suggestion</h3> 
</div> 
<div class="modal-body"> 
    {% if is_granted('ROLE_USER') %}<p>We will reply to {{ app.user.mail }}</p> 
    {% else%}<p>Don't forget to include a reply-to email in your suggestion.</p> 
    {% endif %} 
    <form action="{{ path("mgfbc_arrt") }}" method="post" id="arrt"> 
     <div class="control-group"> 
      <label for="username">Text:</label> 
      <div class="controls"> 
       <textarea id="mail" name="mail" rows="4" style="width:500px;"></textarea> 
      </div> 
     </div> 
     <div class="modal-footer"> 
      <input type="submit" id="butt" class="btn btn-success" value="Send"> 
     </div> 
    </form> 
</div>

而且，JS：

<script type="text/javascript"> 
$("#butt").on('click', function(e) { 
e.preventDefault(); 
}); 
</script>

亂投醫後，我已經達到在這個JavaScript並不妨礙點提交表單。

我在做什麼錯？

在此先感謝。

來源

2013-05-31 gomman

先給裏面的腳本警報，看看是否能在點擊觸發。如果它沒有觸發，那麼你需要在模態的'shown'事件上綁定這個點擊事件。 '（'＃'myModal'）。on（'shown'，function（）{'[Source]（http://twitter.github.io/bootstrap/javascript.html#modals） – anpsmn

不要使用上（）函數，而不是使用委託，試試這個：

$("#arrt").delegate("#butt", "click", function(e){ 
    e.preventDefault();    
});

來源

2013-06-12 23:29:01 Fuser

不要使用'delegate' ，它已經被棄用了。'從jQuery 1.7開始，.delegate（）已經被.on（）方法取代，'on'將以同樣的方式工作。'$（「＃arrt」）。on（「click」「#butt」，function（e）{}）' – Falmarri

@gomman檢查了以下文件：http://api.jquery.com/submit/ 我認爲你需要取消提交 - 事件表單元素使其以您想要的方式工作。

@Fuser儘管delegate（）對我來說更易讀，但使用on（）或delegate（）對於這種情況也是這樣。引用jQuery文檔「從jQuery 1.7開始，.delegate（）已被.on（）方法取代，但對於早期版本，它仍然是使用事件委派的最有效方式。」

來源

2013-06-23 20:59:17 Stjepan

試試這個：

<form action="{{ path("mgfbc_arrt") }}" method="post" id="arrt"> 
    <div class="control-group"> 
     <label for="username">Text:</label> 
     <div class="controls"> 
      <textarea id="mail" name="mail" rows="4" style="width:500px;"></textarea> 
     </div> 
    </div> 
    <div class="modal-footer"> 
     <input type="submit" id="butt" class="btn btn-success" value="Send"> 
    </div> 
</form> 
<script type="text/javascript"> 
$("#arrt").submit(function(e) { 
    e.preventDefault(); 
}); 
</script>

來源

2014-03-06 15:10:41 Darren20

表單AJAX發送內部twitter引導模式（Symfony2）

回答

相關問題