title: Retrieving data from database and displaying it by using ajax
body: <p>Okay people, what I am trying actually trying to achieve is, to create a chat box something similar to fb without refreshing the page. I have two tables in my database(phpmyadmin) where the first table, i store 2 users chat id(unique) and later save their message in another table so that i will be able to retrieve their chat history just by their unique id. </p>
  
  <p>So I was able to send their Id(unique) by using get method to send the unique ID to the second div and then run through the database using php and display their conversation. </p>
  
  <p>So how can i do it in ajax so that the page does not refreshes guys ? Some guide on that please ? I have been trying to google for it but i cant find a way simply because i do not know ajax much. </p>
  
  <p>The purpose of me wanting it to not refresh the page is because i am using Jquery to hide and show the chat conversation. When the page refreshes, the conversation disappears. Im sorry if my explanation is not on point, hopefully somebody understands my problem and guide me in this :D </p>
  
  <p>So here are my codes ...</p>
  
  <p>This code is in my first div. It basically displays all the users who I have chatted with before...</p>
  
  <pre><code>&lt;div&gt;
      &lt;ul style="list-style-type: none;"&gt;
      &lt;?php  
      include 'connectDB.php';
      //retrieve all the message history of yours from the PrivateMessage table
      $query = "SELECT * FROM `messagecheck` WHERE `sender_a` = '$userId' 
              OR `sender_b` = '$userId';";
      $result = mysqli_query($dbconnect,$query);
      if(mysqli_num_rows($result) &gt; 0)
      {   
          //if exist, display the history 
          while($row = mysqli_fetch_assoc($result))
          {   
          ?&gt;
              &lt;a href="Item_v1.php?msgId=&lt;?php echo $row['exist']?&gt;"&gt;
  
              &lt;li style="color:black; width:100%; padding-top:5px" &gt;
                  &lt;input id="IDValue" name="IDValue" value="&lt;?php echo $row['exist']?&gt;" &gt;
                  &lt;?php 
                  //if the sender_a id is not my id, display the name
                  //if sender_a is my id, then display sender_b
                  //Because we dont want to see our name in the chat History
                  if($row['sender_a'] != $userId)
                  {
                      $senderName = $row['sender_a'];
                       include 'connectDB.php';
                       $nameSearch = "SELECT `fName`, `lName` FROM `register` WHERE `id`='$senderName';";
                       $Searchresult = mysqli_query($dbconnect,$nameSearch);
                       $Searchrow = mysqli_fetch_assoc($Searchresult);
                       echo $Searchrow['fName'] ." ". $Searchrow['lName'];
                  }
                  else
                  {
                      $senderName = $row['sender_b'];
                       include 'connectDB.php';
                       $nameSearch = "SELECT `fName`, `lName` FROM `register` WHERE `id`='$senderName';";
                       $Searchresult = mysqli_query($dbconnect,$nameSearch);
                       $Searchrow = mysqli_fetch_assoc($Searchresult);
                       echo $Searchrow['fName'] ." ". $Searchrow['lName'];
                  } 
                  ?&gt;
              &lt;/li&gt;
  
              &lt;/a&gt;
          &lt;?php
          }
      }
      ?&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>So basically when i click the names which will be in the &lt; li > tag, it should be posting the messages in another div(Which is the div below)...</p>
  
  <pre><code>&lt;!-- //Message Content! --&gt;
  &lt;div style="width:100%;max-height: 300;border: 2px solid #1F1F1F;overflow: auto;"&gt;
  &lt;?php 
  if($_GET)
  {
          $msgId = $_GET['msgId'];
  }
  if(!empty($msgId))
  {
      include 'connectDB.php';
      $collectMsgQuery = "SELECT * FROM `privatemessage` WHERE `existing_id` = $msgId";
      $MsgResult = mysqli_query($dbconnect, $collectMsgQuery);
          if(mysqli_num_rows($MsgResult) &gt; 0)
          {
              while($Msgrow = mysqli_fetch_assoc($MsgResult))
              {
                  if($userId == $Msgrow['from_who']){
                  ?&gt;  
                      &lt;h4 class="ifMe"&gt;&lt;span class="ifMeDesign"&gt;&lt;?php echo $Msgrow['message'] ?&gt;&lt;/span&gt;&lt;/h4&gt;
                  &lt;?php
                  }else if ($userId == $Msgrow['to_who']) {
                  ?&gt;
                      &lt;h4 class="notMe"&gt;&lt;span class="notMeDesign"&gt;&lt;?php echo $Msgrow['message'] ?&gt;&lt;/span&gt;&lt;/h4&gt;
                  &lt;?php
                  }
              }
          }
  }
  ?&gt;  
  &lt;/div&gt;
  </code></pre>
  
  <p>P.S : I'm not really sure how to work with ajax so that is why i am posting it here. Any help would be great! Thanks in advance ! :D </p>