검도 UI 모바일 ListView에 실시간 푸시 메시지를 표시하는 방법은 무엇입니까?

Question

새 메시지가 도착할 때마다 JQuery append를 사용하여 브라우저에서 RabbitMQ SockJS Server의 실시간 푸시 메시지를 표시 할 수 있습니다. 그러나 Kendo UI 모바일 ListView (Kendo 버전 2013.3.1119)의 메시지를 내림차순으로 표시하는 방법을 알아낼 수는 없습니다. 맨 위에 새 메시지가 있습니다. 사용자가 ListView를 새로 고치지 않고이 작업을 수행해야합니다.

내가 테스트를 작성 JSBin에 게시 한 - link

노트 JSBin 예에 :

1). Stomp.js (STOMP over websocket) 및 sockjs.js (SockJS Javascript client)는 RabbitMQ SockJS Server에서 메시지를 캡처하는 웹 소켓 클라이언트를 만드는 데 사용됩니다. JSBin의 예를 들어

, 나는 STOMP와 함께 작동 내 자바 스크립트 코드를 추가했습니다 (청취자 app.js를 - 볼 - http://pastebin.com/6qLxH8R6을)를 SockJS 자바 스크립트 클라이언트로 (sockjs.js를) 내가 할 수 아니에요으로 JSBin이 별도의 파일에있는 listener-app.js와 함께 작동하도록하십시오. 결합 된 스크립트는 이제 stomp-listener-app.js입니다. 로컬에서 테스트 할 때이 문제가 발생하지 않았다는 점에 유의하십시오.

2). 두 개의 탐색 버튼, "실시간 ListView"및 "디버그 로그"가 있습니다. Debug Log는 JQuery append를 사용하여 "Debug Log"뷰에 표시 될 stomp.js 디버그 메시지를 캡처합니다. 실시간 ListView 뷰는 STOMP 메시지를리스트 뷰에 표시한다고 가정합니다.

3). JSBin 예제는 라이브 SockJS 서버에 연결하지 않지만 STOMP 라이브러리는 여전히 Kendo UI에서 캡처 할 수있는 오류 메시지를 생성합니다.

저는 JS와 검도 UI의 초보자입니다. 나가 무엇이든을 놓친 경우에 저에게 알려주십시오. 모든 포인터는 매우 감사하게 될 것입니다. 고맙습니다.

Answer 1

prepend/append method을 사용하여 새 메시지를 목록보기 상단에 삽입 할 수 있습니다. 예를 들어

:

$("#datalistlistView").data("kendoMobileListView").prepend([{message: 'test'}]); 

이 코드는 HTML 페이지로부터 링크되어있는 JS 파일에 삽입 할 수있다.

핵심 요구 사항은 목록 뷰가 초기화 된 후에 만 ​​코드를 실행해야한다는 것입니다. 그렇지 않으면 "캐치 유형 오류 : 'prepend'메서드를 호출 할 수 없습니다. 오류가 나타납니다.