提交并显示记录而不重新加载页面

I have a form, which submit data in to table and show them on the same page. But it reloads page.

I want submit and show data without reloading page. I have read so many AJAX scripts. But I am confused .

Can any one help please?

<form action="viewblog.php" method="post"> 
<h3 class="contact_title">Leave a Comment</h3> 
<div class="contact_form">
<div class="row">
<div class="large-4 columns">
<input type="text" name="name" placeholder="Name" />
</div>
<div class="large-12 columns">    
 <textarea cols="10" rows="15" name="comment" placeholder="Comment"></textarea> 
</div>
<div class="small-4 columns">
<input type="submit" name="submit" class="button right" value="Add a comment" />
</div>    
</div>    
</div>    
</form>    

 <?php


if(isset($_POST["submit"])) 
{   
require"connection.php";

extract($_POST);


extract($_REQUEST);


mysql_query("insert into comment values('','',Now(),'$name','$comment')") or die 


(mysql_error());


echo"Comment Inserted Succesfully !";


}


?> 




 <?php



  include('connection.php');


     extract($_REQUEST);


$sql = "SELECT * FROM enteries;";


$result = mysql_query($sql);


while($row1=mysql_fetch_array($result))


            {


                extract($row1);

?> 


<div class="comments">


                    <ol class="comment_list">




                        <!--comment item-->


                        <li class="com_item">


                            <div class="com_main">


                                <div class="com_content">


                                    <div class="com_meta">


                                        <span class="user_name"><a href="#"><?
php echo $name;  ?></a></span>


<span class="com_date"><?php echo date("D jS F Y ", strtotime($dateposted))  ?>

</span>

                                    </div>


                                    <p class="com_text"><?php echo $comment;  ?>
</p>

                                </div>

                            </div>

                        </li>

                    </ol>

                </div>

                <?php


            }


                ?>

PHP executes at server side, so Directly writing PHP and HTML combined won't make call without reload.

you need JavaScript to do AJAX call. You can use jQuery or JavaScript or any other library.

This link will teach you basics about AJAX.

<form> 
    <h3 class="contact_title">Leave a Comment</h3> 
    <div class="contact_form">
        <div class="row">
            <div class="large-4 columns">
                <input type="text" name="name" id='name' placeholder="Name" />
            </div>
            <div class="large-12 columns">    
                <textarea cols="10" rows="15" id='comment' name="comment" placeholder="Comment"></textarea> 
            </div>
            <div class="small-4 columns">
                <input type="submit" name="submit" id='submit' class="button right" value="Add a comment" />
            </div>    
        </div>    
    </div>    
</form>    
<script>
$('#submit').click(function()
{
    var name = $("#name").val();
    var comment = $("#comment").val();
    var dataString = 'name='+ name + '&comment='+ comment;
        $.ajax({
        url: viewblog.php,
        type:'POST',
        data:dataString,
        cache:false,
        success: function(result)
        {
            alert(result);
        }               
        });
});</script>

viewblog.php

<?
$name=$_POST['name'];
$comment=$_POST['comment'];

$query="INSERT INTO TableName SET NameColumnName='$name', CommentColumnName='$comment'";

//Execute Query Here.. 

echo "Comment Submitted Succesfully";

?>