Move to end of list

[Scott]

Dear Sirs,

I am building an application that will allow IM communication between providers and patients.  I am using the following template to show the message:

</script>
<script id="messageTemplate" type="text/x-kendo-template">
                <div class="post-content">
                    <p>Date Of Message: #= date_time_created_to_string#</p>                    
                    <p>To: #= messageReceiverName#</p>
                    <p>From: #= messageSenderName#</p>
                    <p>Message:</p>                    
                    <p>#=message#</p>
                </div>
            <br>
 </script>  

I am using the following code to bind the template to a datasource and add when a new message is added to the data source.  The code is working as expected.  What I would like to happen is when a new message is added is there a way to scroll to that message so that the user does not have to?

        var template = kendo.template($("#messageTemplate").html());
        //var dataSource = new kendo.data.DataSource({data: category});
        messageDataSource = new kendo.data.DataSource({data: theMessages});                        

        messageDataSource.bind("change", function() {
        $("#example").html(kendo.render(template, messageDataSource.view()));
        });

Scott

[Kiril Nikolov]

Hello Scott,

The functionality that you are looking for is not supported out of the box with Kendo UI. However you can achieve this pretty easily using jQuery scrollTo() method and some simple calculations. Please check the following example that I created and let me know if it helps:

http://jsbin.com/malus/1/edit

Regards,
Kiril Nikolov
Telerik