Scrollheight not get height on dynamic content render thorugh ajax and failed to initate Slimscroll from bottom

Question

I spent much time to take scrollheight properly but all actions gone failed.

Problem: 1- Facing Problem to retrieve scrollheight on dynamic content render

2- slimscroll not start from bottom.

Dynamic content load timely so I use scrollheight with slimscroll

3- Slimscroll position start from bottom affect due to scrollheight.

I integrate slimscroll with a chat system container, while content retrieve from ajax and insert (apppend) to chat area. I take scrollheight of that container. so I can initiate scroll (slimscroll plugin) from bottom,

but found two problems here

1- slimscroll not start from bottom on dynamic content.

2- scrollheight return zero right after content render.

$.ajax({ // retrieve data request }).done(function (result) {
$.each(data, function (index, value) { // markup concatenation done })
$(html).insertBefore('.message-center .chat-list .typing-status');

Then I initiate slimscroll code to do action according to scrollheight

var chatList = $('.message-center .chat-list');

    var scrollTo_int = chatList.prop('scrollHeight') + 'px';

    $('.chat-list').slimScroll({
        scrollTo : scrollTo_int,
        height: '400',
        start: 'bottom',
        alwaysVisible: true
    });

But scrollheight shows me zero but If I wait for 2 seconds and put this code in settimeout same slimscroll initialization code in settimeout

// setTimeout(function () {
                //     chatToBottom();
                // }, 2000);

ScrollHeight return correct height and also slimscroll work perfectly. I don't want to wait for these two seconds.

Why I'm failed to get scrollheight even content has been rendered,

If any one can suggest me a good way like:

1- A callback method wait until scrollheight > 0 then function must be initiate.

2- I want to prevent settimeout function, I thought If content increase it may take 1 or 2 second more. that's my thinking.

I spent much time but failed to tackle this, Your suggestion may help to me.

Thanks,

Answer 1

Scrollheight return height correctly and slimscroll also show scroll from bottom If I open popup immediately after page load complete or set popup visibility hidden instead of display none..

My Test case:

During more time to focus on scrollheight and slimscroll, I noticed there's a problem with popup which is hidden where chat rendered.

1- When I display chat in body content area so scroll start from bottom, and also scrollheight return height greater than zero.

When I show chat in popup:

2- If I immediately open chat popup then point-3 case failed and chat shown correctly and scroll height also return greater than zero

3- It chat popup not open immediately so chat area display scrollheight zero and also slimscroll start from top.

Now I have to put logic that If user open popup so show chat from bottom and also If user hide the popup in between chat start from there where user stop.

Anyhow thanks who see this question, Now I work on other scenarios.