title: How can I stop changes in scroll position when refreshing php?
body: <p>I'm trying to load my php code from a database without refreshing, using the ajax .load() function, into a 'text' div that acts as a messaging box with an overflow of scroll. However, whenever the reload occurs, the entire div scrolls back to the top, making it impossible to back through the history of the messages. I'm looking for a way to either A) prevent this scroll from happening or B) change it so it only updates when new information is added to the database, not on a set interval.
  I've tried using scroll top but it doesn't seem to work. The echo will output the scroll position correctly, but it won't work to set the scroll.</p>
  <pre><code>$(document).ready(function() { 
  setInterval(function () {
      var loc = $('#&quot;.$recipient.&quot; &gt; .text').scrollTop();
      console.log(loc);
      $('#&quot;.$recipient.&quot;').load('update.inc.php', {
              roomID: &quot;.$roomID.&quot;,
              recip: '&quot;.$recName.&quot;'
          });
      $('.text').scrollTop(loc);
      }, 1000);
  });
  </code></pre>
  <p>My PHP update code is this:</p>
  <pre><code>&lt;?php
  include(&quot;dbh.inc.php&quot;);
  session_start();
  
  $roomID = $_POST['roomID'];
  $recName = $_POST['recip'];
  
  echo &quot;&lt;div class = 'info'&gt;&quot;;
  echo &quot;&lt;a href = 'social.php'&gt;&lt;i class='fas fa-long-arrow-alt-left'&gt;&lt;/i&gt;&lt;/a&gt;&quot;;
  echo &quot;&lt;div class = 'recipient-info'&gt;&quot;;
  echo &quot;&lt;div class = 'user-img'&gt;&lt;/div&gt;&quot;;
  echo &quot;&lt;h4 class = 'username'&gt;&quot;.$recName.&quot;&lt;/h4&gt;&quot;;
  echo &quot;&lt;/div&gt;&quot;; //End recipient-info
  echo &quot;&lt;/div&gt;&quot;; //End info
  echo &quot;&lt;div class = 'text'&gt;&quot;;
  
  $getMessages = &quot;SELECT * FROM chatroom_posts WHERE roomId = '$roomID' ORDER BY postTime ASC&quot;;
  $messages=$conn-&gt;query($getMessages);
  if($messages-&gt;num_rows &gt; 0) {
      while($message=$messages-&gt;fetch_assoc()) {
          if($message['userId']==$_SESSION['uid']) {
              echo &quot;&lt;p class = 'to'&gt;&quot;.$message['content'].&quot;&lt;/p&gt;&quot;;
          } else {
              echo &quot;&lt;p class = 'from'&gt;&quot;.$message['content'].&quot;&lt;/p&gt;&quot;;
          }
      }
  } else {
      echo &quot;&lt;p class ='from'&gt;You haven't yet talked to me! Enter a message to get started!&lt;/p&gt;&quot;;
  }
  echo &quot;&lt;/div&gt;&quot;; //End text
  </code></pre>