非同期でコメントを投稿する

Question

私は2つのphpファイル（index.phpとinsert.php）を持っています。私のindex.phpは、ユーザーからの3つの入力（アクティビティ、期間、日付 - ）、データベースに格納します。データベースに挿入するためのコードを書いていますが、これは正常に実行されますが、サイトに通知を追加して、入力が挿入されているかどうかを知ることができます。たとえば、入力した時間が数字でないか、0より小さい場合は、時間を適切な値に変更するように通知するテキストをサイトに表示します。私はそのためのスクリプトを書いており、それを非同期的に達成したいと思っています。今、データが正常に追加された場合は印刷したいだけです。今すぐ何も印刷せずに別の空白のページに移動しますが、データベースも正しく更新されます。私が間違って何をしているのか分かりません。

if(!empty($_GET["activity"]) && !empty($_GET["duration"]) &&  !empty($_GET["date"])) { 
    $activity = mysqli_real_escape_string($link, $_GET["activity"]); 
    $duration = mysqli_real_escape_string($link, $_GET["duration"]); 
    $date = mysqli_real_escape_string($link, $_GET["date"]); 

    if(is_numeric($duration) && $duration > 0){ 
     $sql = "INSERT INTO users (activity, dateInput, duration) VALUES ('$activity','$date','$duration')"; 
     $result = mysqli_query($link, $sql); 

     mysqli_close($link); 
     echo '<div class="comment">' ."Successfuly added" . '</div>'; 
    } 
} 

Answer 1

insert.php

のindex.php

<script> 
    $(function() { 
     $('#getData').click(function(event) { 
      event.preventDefault(); 

      $.ajax({ 
       type: "GET", 
       url: "insert.php", 
       data : { activity : $('#activityInput').val(), duration: $('#durationInput').val(), date: $('#dateIn').val(}, 
       beforeSend: function(){ 
       } 
       , complete: function(){ 
       } 
       , success: function(html){ 
        //this will add the new comment to the `comment' div 
        $("#comment").html(html); 
       } 
      }); 
     }); 
    }); 

</script> 

<h1> Add input </h1> 

<form action="insert.php" method="GET"> 
    Fitness activity:<br> 
    <input type="text" name="activity" id="activityInput"><br> 
    Duration of activity (hrs):<br> 
    <input type="text" name="duration" id="durationInput"><br> 
    Date (mm-dd-yyyy):<br> 
    <input type="text" name="date" id="dateIn" ><br> 
    <input type="submit" value="Submit" id="getData"> 
</form> 


<div id='comment' ></div>; 

あなたはあなたの成功コールバック

$("#comment").html(html); 

のIDを使用しているが、あなたのdiv <div class='comment' ></div>;のでどちらかのクラスを持っていますIDに変更するか使用する

$(".comment").html(html);