1

現在、すべての情報 (記事とコメント) を表示するために TWIG を使用しています。そのため、まずデータベースから記事とコメントを取得し、それを配列に渡します。これは、小枝テンプレートに渡されます。次に、各記事を読み込み、各記事の下にその記事のコメントを読み込みます。これらのコメントとそれに関連付けられたボタン (別名、新しいコメント ボタン) はすべてマクロで作成されます。

マクロは、表示する必要があるコメントを含む配列を取得するだけです。記事のコメントを表示し、コメントごとに返信ボタンを作成するため、ユーザーはコメントに返信したり、新しいスレッドを開始したりできます。

AJAX と jQuery を使用して、ページを更新せずに新しいコメントをデータベースに保存しました。ただし、ページ全体を更新せずに新しいコメントを表示する方法を見つける必要があります。TWIGでこれを行う方法について誰か考えがありますか?

私が現在 TWIG で直面している問題は、コメントを非同期に投稿する方法です。ページをロードするときに、最初にコメントの現在のデータベースの配列をロードします。ただし、データベースが更新された場合、それを使用してアレイを更新するにはどうすればよいですか。助言がありますか？新しいコメントが追加されるたびに配列を取得することを考えていたので、私の質問は「TWIG テンプレートで配列を取得する方法は?」です。、しかし、私は他の提案を受け入れます。

4

1 に答える 1

0

あなたの問題は小枝の問題ではありません。小枝のみがテンプレートエンジンであり、ページの最初のレンダリングでのみ使用されます。あなたがすべきことは、ajax保存から成功した応答を得たときに、jqueryを使用して新しいDOM要素を作成し、同じスキーマを使用してページに追加することです. 何かのようなもの：

<script>
$.post(
    TheUrlThatYouPostTo,
    TheDataThatYouPassWithThePost,
    function(returnData, textStatus){
        //assuming that your return data is an array conatianing a boolean successful key
        if(returnData.successful){
            $('#YourCommentsWrapperElement').append('<div class="comment">#some other elements containing the posted values</div>');
        }
    }
);

</script>

または、twig にコメント HTML を生成させたいが、それを JavaScript にハードコーディングしたくない場合は、AJAX 投稿で投稿しているコントローラー アクションに、レンダリングされたバージョンのコメントを返すようにさせることができます。このようなもの：

#Your Controller file
public function ajaxPostAction(Request $request){

    //Handle post data to create a new commentObject

    return array(
        'comment' => $commentObject
    );
}

次に、そのアクションのビュー ファイルを作成します。

#your view for the controller action ajaxPost.html.twig
<div class="comment">
    <h3>{{comment.author}}</h3>
    <p>{{comment.content}}</p>
</div>

次に、JavaScript は戻りデータを取得し、既存のリストに追加します。

<script>
$.post(
    TheUrlThatYouPostTo,
    TheDataThatYouPassWithThePost,
    function(returnData, textStatus){
        //Now your return data is the HTML for the new comment so just append it to the rest
        $('#YourCommentsWrapperElement').append(returnData);
    }
);

</script>
于 2013-03-29T23:17:01.197 に答える