Unstable error, cannot read properties of undefined

See more:

Javascript

Ajax

JSON

This is to get the annotation data from the server, render it with js and display it on the screen.

A random error occurs. The value returned by php is correct, but it throws an error in js. It works normally, but randomly throws an error.

Uncaught TypeError: Cannot read properties of undefined (reading 'user_id')

Looking at the network, the values ​​returned by php are correct. This either throws an error or works fine, depending on the content being commented on.

What I have tried:

$(document).ready(function(){

    $( document ).on('click' , '.view_comments' , function(){
        let id = $(this).attr("id");
        let content = $("#comment-post-"+id).val();

        $.ajax({
             type:"GET",
             url: "view_comment.php",
             data:{ enclosure: content },
             success:function(html){
                 var result = JSON.parse(html);
                 if( result.length > 0 ){
                     var comment = '';
                     for(let i = 0; i < 5 ; i++ ){
                         var comment_list = comment_object();
                         comment_list.set_properties( result[i] );
                         comment += comment_list.get_html();			
                     }
                     $("ul#comments-"+id).append(comment);
                     $(this).html('More Comments');
                 }
             },
            error: function( xhr ){
                /* error_log */ 
                console.log(xhr.status+' '+xhr.statusText);
            }
        });
        return false;       
    });       


var comment_object = function(){
    var user_id = '';
    var username = '';
    var date = '';
    var comment = '';

    return {
	set_properties: function( data ){
        user_id = data['user_id'];
	    username = data['username'];
	    date = data['date'];
	    comment = data['comment'];	   
	},	
	get_html: function(){
	    return "<li class='wts-comment'><div class='wts-comment-left'>"+username+""+date+"</div><div class='wts-comment-text'><div class='wts-comment-wrapper'>"+comment+"</div><div class='wts-comment-action-icons'><div class='wts-comment-action-btn'></div><div class='wts-comment-action-btn '></div><div class='wts-comment-action-btn'>Comment</div></div></div></li>";
	}
    };
};
   
});

/* view_comment.php */
$id = $_GET['enclosure'];

$conn = db_connect();
$result = $conn->query("select user.user_id, user.username, comments.comment, comment.date from user, comments where comments.content=".$id." and comments.author = user.id order by comments.date DESC limit 5") or die("access failed". mysqli_error( $conn ) );

 $rows = array();
 while( $r = mysqli_fetch_assoc( $result ) ){
     $rows[] = $r;
 }
 print( json_encode( $rows ) );