Анимация первого элемента PrimeFaces Datatable - PullRequest
Новая
       30

Анимация первого элемента PrimeFaces Datatable

1 голос
/ 28 марта 2012

У меня есть список сообщений, загруженных в dataTable , и у меня есть форма для добавления нового сообщения в "стену".

Я бы хотел сделать что-то похожее на стену Facebook, поэтому, когда я вставляю новое сообщение, я хотел бы иметь эффект затухания, когда оно появляется.

Я пытался использовать эффекты PrimeFaces, но он будет применять эффект ко всей DataTable, поэтому я подумал об использовании простого скрипта JQuery, но я не знаю, как это сделать.

Вот простой код моей последней попытки (это не работает!): 

<script type="text/javascript">  
        function animateNewPost(id) {                 
            jQuery('#post_' +id).effect("slide", { direction: "right" }, 2000);                
        }  
    </script>
[cut]
<p:commandLink ajax="true" action="#{postBean.insertPost(loginBean.user)}" value="Insert Post" update=":postMessage, :postList, :postForm" oncomplete="animateNewPost(#{lazyPostBean.posts.get(0).getIdPost()})"/>
[cut]
 <p:dataTable id="postTable" var="post" value="#{lazyPostBean.posts}">
                    <p:column style="border: 0px; background: rgba(0,0,0,0);">                            
                        <div class="feature">                                
                            <div class="post_#{post.idPost}">                                
                                [POST CONTENT]           
                            </div>
                        </div>
                    </p:column>                                              
                </p:dataTable>

Что я должен сделать?

РЕДАКТИРОВАТЬ: идентификатор правильно передается в функцию javascript, и HTML-вывод для div поста 

<div class="post_24">

Так что я думаю, что это правильно.

1 Ответ

0 голосов
/ 28 марта 2012

для начала вы должны исправить селектор jquery с #, который нацелен на идентификатор элемента в . (одна точка), который ссылается на класс, подобный этому jQuery('.post_

селектор класса

...