Ajaxリクエストを遅らせる方法は？

Question

私は、データがmysqlデータベースに挿入され、データベースの行数が実行され、その結果が表示されるフォームページに返されるサーバー側ページにデータをポストするフォームを持っています。

私はajaxを使用して行数データを取得していますが、データがデータベースに挿入されるまでAjax呼び出しを遅延させることが可能かどうかはわかりません。データが送信されましたか？現在のコードは動作しますが、フォームが送信される前の行数だけが表示されます。私は真の結果を得るためにページをリロードする必要があります。

Form.php

<form class="form-inline" action="" id="myform" form="" method="post"> 
<!-- Text input--> 
<div class="form-group"> 
    <label class="col-md-4 control-label" for="name"></label> 
    <div class="col-md-8"> 
    <input id="name" name="name" type="text" placeholder="name" class="form-control input-lg" required> 
    </div> 
</div> 

<!-- Button --> 
<div class="form-group"> 
    <label class="col-md-4 control-label" for="submit1"></label> 
    <div class="col-md-4"> 
    <button id="submitButtonId" name="submit1" class="btn btn-primary btn-xl">Submit</button> 
    </div> 
</div> 
</form> 

<div id="count"></div> 
</div> 

jqueryの

<script> 
//Post data from form 
$(document).ready(function(){ 
$("#submitButtonId").on("click",function(e){ 
    e.preventDefault(); 

var formdata = $(this.form).serialize(); 
    $.post('server.php', formdata, 
      function(data){ 
    //Reset Form 
$('#myform')[0].reset(); 
      }); 

return false; 
}); 
}); 
</script> 
<script> 

//Fetch Rowcount from server.php 
    $(document).ready(function(){ 
$.ajax({ 
        url: 'data.php', 
        dataType: "json", 
        success: function (data) { 
        $("#count").html(data.count); 

} 
}); 
}); 
</script> 

server.phpという

<?php 
//Connect to db 
include_once("db_conx.php"); 
if(isset($_POST['name'])){ 
$name= mysqli_real_escape_string($db_conx,$_POST['name']); 

//Update Database 
$stmt = $db_conx->prepare('INSERT INTO myTable set name=?'); 
$stmt->bind_param('s',$name); 
$stmt->execute(); 
} 
//Count Rows 
$sql="SELECT name FROM myTable"; 
$query = mysqli_query($db_conx, $sql); 
    // Return the number of rows in result set 
    $rowcount=mysqli_num_rows($query); 

// send output 
$my_data=array(count=>"$rowcount"); 

echo json_encode($my_data,true); 
?> 

Answer 1

最初のajax投稿の応答内の行数を取得するajaxを呼び出します。

<script> 
//Post data from form 
$(document).ready(function(){ 
$("#submitButtonId").on("click",function(e){ 
    e.preventDefault(); 

    var formdata = $(this.form).serialize(); 
    $.post('server.php', formdata, 
      function(data){ 
       //Reset Form 
       $('#myform')[0].reset(); 
       fetchRowCount(); 
    }); 

    return false; 
}); 
}); 

function fetchRowCount() { 
    $.ajax({ 
        url: 'data.php', 
        dataType: "json", 
        success: function (data) { 
         $("#count").html(data.count); 

        } 
    }); 
} 
</script> 

Answer 2

あなたはこのようなポスト後にカウント行関数を呼び出すことができます。

$.post('server.php', formdata, 
    function(data) { 
     //Reset Form 
     $('#myform')[0].reset(); 
     $.ajax({ 
      url: 'data.php', 
      dataType: "json", 
      success: function(data) { 
       $("#count").html(data.count); 
      });) 
    }); 

Answer 3

コードから正しく理解できれば、行数の取得は$（document）.readyで実行されることがわかります。 これは、ページが一度（そして毎回）読み込まれると、そのページが実行されることを意味します。 だから、この起こる：行数を取得）ページが

2にロードされている）

1を

3を実行している）あなたは

4を提出）あなたがに行くためにページをリロードする必要がありますポイント2を返します。解決策は、ドキュメントの準備ではなく、サブミットが実行された後にコールバック関数として行のフェッチを実行することです。