Submiting for using ajax and php and return response

Question

I am using this php to submit a form and is working now i want to post to it using ajax and return what i have submitted without reloading the page but is not posting to me database and it not showing me errors. Which other simple way can i archive this or can anyone show me where am doing it wrong Here is the full program <?php echo $_GET['postid'];?> < this get ID of my main blog post HTML STRUCTURE

<form id="add-comment" action="javascript:void(0);" style="font-size: 100%;">
<textarea placeholder="" name="comment" cols="68" rows="3" style="min-height:30px;" id="comment"></textarea>
<?php 
if(!isset($_SESSION['user_login'])) { 
echo "<label>Enter name</label><br>";
echo "<input placeholder='Enter a name' style='width:130px;height: inherit;' required='true' id='anony' type='text' name='name'/>";
}?>
<input tabindex="0" value="Add Comment" class="btnpostq" id="donedbtn" type="submit"/>
<input type="hidden" value="<?php echo $_GET['postid'];?>" name="rid"/>
</form> 

Ajax

<script>
$(document).ready(function(){
    $('#add-comment').submit(function(){

        $('#response').html("<b>Loading response...</b>");
        $.ajax({
            type: 'POST',
            url: 'alter_reply.php', 
        data:'comment='+comment+'&name='+name+'&rid='+rid,
        })
        .done(function(data){

            $('#response').html(data);

        })
        .fail(function() {

            alert( "Posting failed." );

        });
        return false;

    });
});
</script>

alter_reply.php

<?php

if($_POST) {
$db_host = "localhost";
$db_user = "root";
$db_pass = "";
$db_name = "post";

     try {
     $db_conn = new PDO("mysql:host={$db_host};dbname={$db_name}",$db_user,$db_pass);
     $db_conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
     $stmt = $db_conn->prepare("INSERT INTO replys(rid,mesreplys,rtime,rusername) VALUES(:rid,:mesreplys,:rtime,:rusername)");


$stmt->bindParam(':rid', $rid); 
$stmt->bindParam(':mesreplys', $comment);
$stmt->bindParam(':rtime', $timedate); 
$stmt->bindParam(':rusername', $user); 



$form = $_POST;
$rid= $form['rid'];
$comment = $form['comment'];
$timedate = date("Y-m-d H:i:s");
if(isset($_SESSION['user_login'])){
$user = $_SESSION['user_login'];
}else{
$anony_user = $form['name'];
$user = $anony_user;    
}   

    $stmt->execute();

    }
catch(PDOException $e)
    {
    echo "Error:" . $e->getMessage();
    }
$db_conn = null;
}
?> 

Answer 1

You have not gathered the variables values. Get them and then pass to $.ajax as below :

var comment = $('#comment').val();
var name = $('#anony').val();
var rid = $('#rid').val();

Make sure you have id in your inputs.

You form should look like :

<form id="add-comment" action="javascript:void(0);" style="font-size: 100%;">
<textarea placeholder="" name="comment" cols="68" rows="3" style="min-height:30px;" id="comment"></textarea>
<?php 
if(!isset($_SESSION['user_login'])) { 
echo "<label>Enter name</label><br>";
echo "<input placeholder='Enter a name' style='width:130px;height: inherit;' required='true' id='anony' type='text' name='name'/>";
}?>
<input tabindex="0" value="Add Comment" class="btnpostq" id="donedbtn" type="submit"/>
<input type="hidden" value="<?php echo $_GET['postid'];?>" id="rid" name="rid"/>
</form> 

And script must be :

<script>
$(document).ready(function(){
    $('#add-comment').submit(function()
    {
        var comment = $('#comment').val();
        var name = $('#anony').val();
        var rid = $('#rid').val();

        $('#response').html("<b>Loading response...</b>");
        $.ajax({
            type: 'POST',
            url: 'alter_reply.php', 
        data:'comment='+comment+'&name='+name+'&rid='+rid,
        })
        .done(function(data){

            $('#response').html(data);

        })
        .fail(function() {

            alert( "Posting failed." );

        });
        return false;

    });
});
</script>