ajax 实现网页异步数据替换

今天做了下网页数据的处理（效果如下）：点击上面的分类 ，下面的数据将根据筛选发生替换（jquery+ajax+symfony+twig+css）

效果



代码如下：
jquery+ajax:

//trainingcontainer click
$('.trainingcontainer').on('click', function(){
$('.ajax-click-event').trigger( "click" );
var EventTag = $(this).find('.trainingcontainer-eventTag').attr('value');
$(this).find('.front-content').addClass('effect-click');
$.ajax({
url: '',
type: 'POST',
async: true,
data : { event_tag:EventTag},
success: function(data) {
$('.eb-event-listing').replaceWith(data);
},
});
    });

Controllor:

  public function indexAction(Request $request)
    {
if(isset($_POST['event_tag'])){
$event_tag = $_POST['event_tag'];

}else{
return $this->render('TrainingBundle:Training:index.html.twig', array(
));
}

    }

前端展示：