I've spent a considerable amount of time searching for an answer to this question, but unfortunately, none of the solutions I found were suitable for my specific scenario.
Currently, I am developing a Chat Application and one key feature is displaying older messages for selected chat channels. The container that holds these messages is a <table> element placed within a <div>. I have defined fixed dimensions for this div to control its height and width.
The messages from the chat channel are fetched from an SQL table using a corresponding servlet, and then displayed in the table utilizing AngularJS. My main query revolves around whether it is possible, using html/css/angular/javascript, to automatically scroll the div once all the messages have been uploaded?
Showcased below is a snippet of my code:
HTML:
<div ng-show="channelmsg">
<div style="max-width: 500px; max-length: 500px; height: 500px; overflow: auto;" id="mydiv">
<table>
<tr ng-repeat="c in ChannelMsgResult">
<td style="border: 1px; border-color =light gray; max-width:400px;">
<span><img ng-src={{c.Photo}} style="border-radius:0.5cm; width: 50px; height: 50px;" />
<a href="#" style="color: gray;"> {{ c.Nickname }} :</a> </span>
<br /> {{ c.Content }} <a href="#"><small>reply</small></a>
<a href="#">see replies</a> <br />
<label style="color: #9fa1a3;"><small>{{ c.DateTime }}</small></label>
</td>
</tr>
</table>
</div>
</div>
The relevant Controller's function responsible for invoking the servlet and displaying (via ng-show) the "mydiv" div:
$scope.displayChannelMsg = function(x) {
$http.get("http://localhost:8080/ExampleServletv3/displaychannelmsgservlet",{
params:{
channelid : x.ChanID
}
}).success(function(response) {
setTimeout(function () {
$scope.$apply(function(){
console.log("went to servlet and succeeded")
$scope.ChannelMsgResult = response;//this variable will hold the channels
$rootScope.channelmsg=true;
});
});
});
};
Is there a straightforward way to achieve this functionality without relying on external libraries (e.g., angular-glue)?
Your guidance on this matter would be greatly appreciated.
Thank you!