CODEWITHSUNDEEP
c#javascriptjquery
filipehd
filipehd

Reputation: 930

scrollTop() doesn't work with TextArea on IE

This question is quite common however I haven't seen a quite similar problem to mine. I have my .cshtml file where I've declared a TextArea using the Microsoft MVC HtmlHelpcer class. The code is the following:

@Html.TextArea("contentContainer", new Dictionary<string, object> { { "style", "width: 100%; height: 600px" } })

Then I have a function which is reading from a LogFile all the time and appending/adding the content of this file to this TextArea everytime there is an update. So I have my function in jQuery which appends the content to the TextArea and then I want it to Scroll the TextArea to the very bottom of the TextArea. The code is quite simple:

appendContent: function (content) {

    var $textArea = $('#contentContainer');
    var shouldBeScrolled = true;

    $textArea.append(content);

    var shouldBeScrolled = true;
    if (shouldBeScrolled) {
        $textArea.scrollTop(
           $textArea[0].scrollHeight
        );
    }
}

Please ignore the shouldBeScrolled variable. I just have it cause later I plan to create some constraints on scrolling.

OK, basically this code works perfect on Chromium, the content gets appended and the TextArea is scrolled to the bottom. On Internet Explorer it simply doesn't scroll. Why is this happening?

Upvotes: 0

Views: 148

Answers (1)

Emanuele Ciriachi
Emanuele Ciriachi

Reputation: 2264

This could very well be a bug in JQuery - I had the same issue before, and as a workaround I ended up scrolling to another item that contains my TextArea and has its top boundary coincident with the TextArea.

Something like this:

<div id="TextAreaContainer">
  <textarea></textarea>
</div>

And then the Javascript would look like:

$("#TextAreaContainer").scrollTop();

Upvotes: 1

Related Questions