Unable to update jQuery mCustomScrollbar

asp.net, gridview, jquery, jquery-ui, scrollbar

Solution

I've figured out the solution.

for the slideToggle, all we have to do is place the Update in a function and call it in the toggle. ie call the function when toggle is completed.

function updateScrollbar() {
    $('#rightFixed').mCustomScrollbar("update");
}

$("#showTax").click(function () {
    $("#cartTaxDiv").slideToggle(updateScrollbar); // Call the update Scrollbar after the sliding is done.
    $(this).text($(this).text() == 'Show Tax' ? 'Hide Tax' : 'Show Tax');
})

So the Toggle problem is solved.

Coming to the Second problem - GridView. When the GrodView is being updated, the scrollbar has to be updated.So for this, we have to call this function on every postback. I'm not using update panel here so i'll call this function if postback in pageload.

if (IsPostBack)
{ Page.ClientScript.RegisterStartupScript(this.GetType(), "myscript", "updateScrollbar();", true); }

Hence the problems solved.

Problem

I'm using custom scrollbar from http://manos.malihu.gr/jquery-custom-content-scroller/ . I'm using it on a div which contains gridview. when a new row is added to Gridview, and it exceeds the size, the scroll bars are not being displayed. and I have another issue There is a div within and i'm using a button to toggle the display of that div. I'm unable to update the Scrollbar ``` (function($) { $(window).load(function() { $("#rightFixed").mCustomScrollbar({ scrollInertia: 150, autoHideScrollbar: true, updateOnBrowserResize: true, updateOnContentResize: true, theme: "dark-2" }); }); })(jQuery); $(function () { $("#showTax").click(function () { $("#cartTaxDiv").slideToggle(); $(this).text($(this).text() == 'Show Tax' ? 'Hide Tax' : 'Show Tax'); $('#rightFixed').mCustomScrollbar("update"); }); }); ``` One thing the scrollbar initialization event is in `$(window).load` and Button Click is in `$(document).ready`. Can you help me ??

Original source