nanobash
nanobash

Reputation: 5500

jQuery custom content scroller scrolling

I've done scroll bar with jQuery custom content scroller just fine , but have some problems with it. Exactly I've done this scroll bar with div tag in which I'm retrieving data from mysql (some posts), so my problem is that I'm using ajax for sending data to database and it works too ,but when data is appended on div tag , scroller has fixed size , it isn't renewing (only renewing when page is refreshed). How can renew scroll bar size within adding data with ajax ? And also I can't understand how it is possible to fix scroll bar at the end ? pls help I'm very confused about this issue , thanks :)

PS. here is plugin home page too http://manos.malihu.gr/jquery-custom-content-scroller

UPDATE

$.ajax({
                url:  "ajax/posting.php",
                type: "POST",
                data: {send_post: "Send", user_id: "<?php echo $userArr[0]; ?>", user_name: "<?php echo $userArr[2] . " " . $userArr[3]; ?>", msg: $("#post").val()},
                complete: function(){
                    $("#post").val("");
                },
                success: function(result){
                    $.ajax({
                        url:  "ajax/posting.php",
                        type: "POST",
                        data: {renew_posts: "Yes",admin: "<?php echo $userArr[1]; ?>",owner: "<?php echo $userArr[0]; ?>"},
                        success: function(renewed_data){
                            $("#chat_tb").html(renewed_data);
                            (function($){$(window).load(function(){$(".post_container").mCustomScrollbar({
                                scrollButtons:{enable:true,scrollSpeed: 40}
                            });});})(jQuery);
                        }
                    });
                }
            });

In this code only it is remarkable how to update mCustomScrollbar() function within callback , after sending data to database

Upvotes: 0

Views: 6373

Answers (1)

yckart
yckart

Reputation: 33408

Take a look at the Fluid scrollbar demo.

EDIT

If that don't works try to reinitialize the .mCustomScrollbar()-functon after your ajax request.

EDIT 2

Just a try:

$.ajax({
    url: "ajax/posting.php",
    type: "POST",
    data: {
        send_post: "Send",
        user_id: "<?php echo $userArr[0]; ?>",
        user_name: "<?php echo $userArr[2] . "" . $userArr[3]; ?>",
        msg: $("#post").val()
    },
    complete: function() {
        $("#post").val("");
    },
    success: function(result) {
        $.ajax({
            url: "ajax/posting.php",
            type: "POST",
            data: {
                renew_posts: "Yes",
                admin: "<?php echo $userArr[1]; ?>",
                owner: "<?php echo $userArr[0]; ?>"
            },
            success: function(renewed_data) {
                $("#chat_tb").html(renewed_data);
                $(".post_container").mCustomScrollbar({
                    scrollButtons: {
                        enable: true,
                        scrollSpeed: 40
                    }
                });
            }
        });
    }
});​

Upvotes: 1

Related Questions