簡體   English   中英

在Symfony2中由ajax提交表單

[英]submit form by ajax in Symfony2

我有什么行動,首先需要通過ajax呈現表單,然后需要更新現有值。 我已經獲得了具有適當值的呈現表單,但是當我單擊以ajax提交表單時,我無法阻止表單提交,我有以下腳本:

 $('#edit-comment').click(function (e) {
    e.preventDefault();
    console.log(1);
});

但是順服還是可以的! 我做錯了。 而且我不知道在編輯操作中如何處理提交的表單。 這是其中的現有部分:

 /**
 * @Route("/edit/comment", name="chat_edit", options={"expose"=true})
 */
public function editAction(Request $request)
{
    $comment_id = json_decode($request->getContent(), true)['commentId'];
    $comment = $this->get('comment.repository')->find($comment_id);
    $form = $this->createForm(new CommentType(), $comment);

    return $this->render("ChatCommentBundle:Comment:form.html.twig",
        array('form' => $form->createView())
    );
}

鏈接到表單類型的要點

更新:

原始答案(如下)仍然適用,但是鑒於該表單實際上是使用AJAX加載的,因此您不能在$(document).ready回調中綁定事件偵聽器。 最好的選擇是使用事件委托。 這是通過將事件偵聽器附加到確實存在的DOM元素上來完成的,但是讓該偵聽器為可能在以后添加的元素選擇事件。 例如:body元素將始終存在,因此您可以在此偵聽表單提交,無論該表單是否存在無關緊要:

$('body').on('submit', '#form-id', function(e)
{
    console.log('#form-id was submitted, do AJAX => submission stopped');
    return false;
    //or
    e.preventDefault();
    e.stopPropagation();
});

在此很好地解釋為什么以及如何工作。 歸結為以下事實:所有事件都通過目標節點的所有父DOM元素,因此您可以在DOM中的任何位置附加偵聽器,並在事件到達目標之前對其進行處理。
我認為我的這個舊答案也可以解釋一兩個問題。 它不使用jQ,但包含jQ內部用於委派的代碼的簡化版本。


您可以防止click事件對$('#edit-comment')的默認影響,但是該事件仍會傳播到表單。 您可能還想添加e.stopPropagation() 或者簡單地return false; 從回調中進行(這將防止默認設置停止傳播)。

但是,防止提交表單的更好方法是使用submit事件,然后在此處停止提交:

$('#form-id').on('submit', function(e)
{
    console.log('Do ajax call here');
    return false;
    //or
    e.preventDefault();
    e.stopPropagation();
});

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM