Index page comments not inserting into database using AJAX - php

Question

I'm trying to insert a comment into a database but I keep getting an Object object alert whenever trying to submit it and it never makes it to the database. The files are all in the same folder.
Any help is appreciated, thanks in advance.
index.php
<?php require_once('include/header.php'); require_once('include/browser.php'); ?>
<div class="content">
<section>
<div class="article">
<?php
$userNameQuery = "SELECT * FROM (SELECT * FROM `tbl_posts` ORDER BY 'post_id' DESC)
t ORDER BY `post_id` DESC
LIMIT 3";
$result = mysqli_query($connection, $userNameQuery)
or die("Error in query: ". mysqli_error($connection));
while ($row = mysqli_fetch_assoc($result)){
$post_id = $row ['post_id'];
?>
<div class="wrapper">
<div class="titlecontainer">
<h1><?php echo $row['post_title']; ?></h1>
</div>
<div class="textcontainer">
<?php echo $row['post_content']?>
</div>
<?php
if (!empty($row['imagePath'])) //This will check if there is an path in the textfield
{
?>
<div class="imagecontainer">
<img src="<?php echo $row['imagePath']; ?>" alt="Article Image">
</div>
<?php
}
?>
<div class="timestampcontainer">
<b>Date posted :</b><?php echo $row['post_timestamp']; ?>
<b>Author :</b> Admin
</div>
<?php
//Selecting comments which correspond to the post
$selectCommentQuery = "SELECT * FROM `tbl_comments`
LEFT JOIN `tbl_users`
ON tbl_comments.tbl_comments_users_id = tbl_users.id
WHERE tbl_comments.tbl_comments_post_id ='$post_id'";
$commentResult = mysqli_query($connection,$selectCommentQuery)
or die ("Error in the query: ". mysqli_error($connection));
//showing the comments
echo '<div class="comment-block_' . $post_id .'">';
while ($commentRow = mysqli_fetch_assoc($commentResult))
{
?>
<div class="commentcontainer">
<div class="commentusername"><h1>Comment by: <?php echo $commentRow['username']?></h1></div>
<div class="commentcontent"><?php echo $commentRow['comment_content']?></div>
<div class="commenttimestamp"><?php echo $commentRow['comment_timestamp']?></div>
</div>
<?php
}
?>
</div>
<?php
if (!empty($_SESSION['cleanUsername']) )
{
?>
<form method="POST" class="post-form" action="index.php" >
<label>New Comment</label>
<textarea name="comment" class="comment"></textarea>
<input type="hidden" name="postid" value="<?php echo $post_id ?>">
<input type="submit" name ="submit" class="submitComment"/>
</form>
<?php
}
echo "</div>";
echo "<br /> <br /><br />";
}
require_once('include/footer.php'); ?>
comments.js
$(document).ready(function(){
$(document).on('click','.submitComment',function(e) {
e.preventDefault();
//send ajax request
var form = $(this).closest('form');
var comment = $('.comment',form);
if (comment.val().length > 1)
{
$.ajax({
url: 'postComments.php',
type: 'POST',
cache: false,
dataType: 'json',
data: $(form).serialize(), //form serialize data so we can enter into database
beforeSend: function(){
//Changing submit button value text and disabling it
$(this).val('Submiting ....').attr('disabled', 'disabled');
},
success: function(data)
{
var item = $(data.html).hide().fadeIn(800);
$('.comment-block_' + data.id).append(item);
// reset form and button
$(form).trigger('reset');
$(this).val('Submit').removeAttr('disabled');
},
error: function(e)
{
alert(e);
}
});
}
else
{
alert("Please fill the field!");
}
});
});
postComments.php
<?php
if (isset($_SERVER['HTTP_X_REQUESTED_WITH'])):
session_start();
require_once('ajaxconnection.php');
$connection2 = connectToMySQL();
$userId = $_SESSION['userID'];
$username = $_SESSION['cleanUsername'];
$comment = $_POST['comment'];
$postId = $_POST['post_id'];
$date_format = " Y-m-d g : i : s";
$time = date ($date_format);
$insertCommentQuery = "INSERT INTO `tbl_comments`
(`comment_content`,`tbl_comments_users_id`,`tbl_comments_post_id`)
VALUES ('$comment', $userId, $postId)";
$result = mysqli_query($connection,$insertCommentQuery);
$obj = array();
$obj['id'] = $postId;
$obj['html'] = '<div class="commentcontainer">
<div class="commentusername"><h1> Username :'.$username.'</h1></div>
<div class="commentcontent">'.$comment.'</div>
<div class="commenttimestamp">'.$time.'</div>
</div>';
echo json_encode($obj);
connectToMySQL(0);
endif?>
ajaxconnection.php
<?php
function connectToMySQL()
{
$connection2 = mysqli_connect("localhost","root","","ascaniobajada2ed8s")
or die('Error connecting to the database');
return $connection2;
}
?>

Answer 1

JQuery .Ajax returns error like this (jqXHR, textStatus, errorThrown). So use it like this to see the real error and not just object object
error: function (jqXHR, textStatus, errorThrown) {
alert(textStatus);
}