Error with a Chat in a Modal preserves the previous queries

0

Before Hello

I have this code for a chat and what happens is that every time I open a new chat retains the previous ones I have already searched for the error but I do not see it if there is someone who can see help.

CODE BOTTON

<a data-toggle="modal" data-target="#view-modal" data-id="11" id="getUser" class="chat__friend" info="This is some information for our tooltip.">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a>

CODE MODAL

        <div id="view-modal" class="modal_fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
             <div class="modal-dialog"> 
                  <div class="modal-content"> 

                      <button type="button" class="close_modal_chat" data-dismiss="modal" aria-hidden="true">×</button> 

                       <div class="modal-body"> 

                           <div id="modal-loader"  >
                            <img class="img_modal" src="./img/loading_data.gif"><br>
                            <br>
                            <button type="button" class="btn_modal" data-dismiss="modal">Close</button>  
                           </div>

                           <!-- content will be load here -->                          
                           <div id="dynamic-content"></div>

                        </div> 
                 </div> 
              </div>
       </div><!-- /.modal -->    

    </div>


<script>
$(document).ready(function(){

    $(document).on('click', '#getUser', function(e){

        e.preventDefault();

        var uid = $(this).data('id');   // it will get id of clicked row

        $('#dynamic-content').html(''); // leave it blank before ajax call
        $('#modal-loader').show();      // load ajax loader

        $.ajax({
            url: 'http://localhost/new/chat_user.php',
            type: 'POST',
            data: 'id='+uid,
            dataType: 'html'
        })
        .done(function(data){
            console.log(data);  
            $('#dynamic-content').html('');    
            $('#dynamic-content').html(data); // load response 
            $('#modal-loader').hide();        // hide ajax loader   
        })
        .fail(function(){
            $('#dynamic-content').html('<i class="glyphicon glyphicon-info-sign"></i> Something went wrong, Please try again...');
            $('#modal-loader').hide();
        });

    });

});

</script>

CODE CHAT

<?php

    require_once 'conectarbd.php';
    require ("function.php");
     if(isset($_POST["id"]))  
 {  
      $output = '';  
      $query = "SELECT * FROM user WHERE userID='".$_POST["id"]."'";  
      $result = mysql_query($query);  
      while($data = mysql_fetch_array($result))  
      {  
            $user_id = $data['userID'];

           $output = '  
            <div class="all_content_chat">                  
                <div class="wall_messages_content_user">

                    <div class="name_user_post_modal"> 
                        <img class="modal_img" src="./img/avatar_default.png" alt="">   
                        <div>  
                            <p class="friend__name">'.$user_id.'</p>  
                        </div>  
                    </div>

                    <div class="wall_messages_content_chat" id="messages_private_chat"></div>

                </div>
                <div class="wall_messages_user_text">
                    <div class="messages_chat_box">
                        <input class="input_messages_chat_user" id="messages" type="text" placeholder="Type Message Hit Enter"></input>
                        <a class="message__send" onclick=""></a>
                    </div>
                </div>  
            </div>  

           ';  
      }  
      echo $output;  
 }  
 // '.get_emoticons_messages().'
?>  


    <!-- **Javascript jquery, ajax Of chat** -->
    <script type="text/javascript">

    ////////////////// scroll a messages new 

            $(document).ready(function(){
                var out, isScrolledToBottom;

                out = document.getElementById("messages_private_chat"); // outer container of messages


                // initial load of chat                     ////**Chat post id
                $('#messages_private_chat').load("messages_private_load.php?id=<?php echo $user_id; ?>", function() {
                  out = document.getElementById("messages_private_chat"); // re-reference after a jQuery .load() as it removes the original dom element and add a new one
                  scrollToBottom(true);
                });


                // check for chatter every second
                setInterval(function() {

                    isScrolledToBottom = checkIfScrolledBottom();

                    $('#messages_private_chat').load("messages_private_load.php?id=<?php echo $user_id; ?>", function() {
                      out = document.getElementById("messages_private_chat"); // re-reference after a jQuery .load() as it removes the original dom element and add a new one
                      scrollToBottom(isScrolledToBottom);
                    });

                },1000);

                function checkIfScrolledBottom() {
                    // allow for 1px inaccuracy by adding 1
                    return out.scrollHeight - out.clientHeight <= out.scrollTop + 1;
                }

                function scrollToBottom(scrollDown) {
                    if (scrollDown)
                    out.scrollTop = out.scrollHeight - out.clientHeight;
                }
                //setTimeout(function() { $("#chat-feed").scrollTop($("#chat-feed")[0].scrollHeight);}, 1200);
            });

    </script>

    
asked by Shareiv 06.06.2017 в 20:10
source

0 answers