データベース内の値をブートストラップモーダルフォームで更新する

Question

データベースからユーザーアカウント情報を表示しているページがあります。アカウント情報を編集するために、私はブートストラップモーダルを構築しました。今私はモーダルでフォームを提出した後、親ページを更新して、データベースから更新された値がページに表示されるようにします。どうすればいいですか？ここで

は、モーダルフォームがあるページのコードです：私は、URLを変更していた場合 ここ：ここ

<p data-placement="top" data-toggle="tooltip" title="Edit" data-original-title="Edit"> 
      <button class="btn btn-primary btn-xs" data-title="Edit" data-toggle="modal" data-target="#edit"> 
       <span class="glyphicon glyphicon-pencil"> Edit</span> 
      </button> 
      </p> 

      <div class="modal fade" id="edit" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> 
       <div class="modal-dialog" role="document"> 
        <div class="modal-content"> 

         <div class="modal-header"> 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
         <h4 class="modal-title" id="myModalLabel">Edit Your Detail</h4> 
         </div> 

         <div class="modal-body"> 
          <form method="post" action="process.php" class="updateForm"> 
           <div class="form-group"> 

            <input type="hidden" name="userID" value="<?php echo $_SESSION['user']; ?>" /> 
            <label for="customer_name">Customer Name :</label> 
            <input class="form-control" type="text" name="customer_name" id="customer_name" value="<?php echo $userRow['fullName']; ?>" /> 


         </div> 

         <div class="modal-footer"> 
            <!-- <input type="submit" name="submit" class="btn btn-block btn-warning" value="Save changes" /> --> 
            <input type="submit" name="submit" class="btn btn-success" id="submit" /> 
           </div> 
          </form> 
         </div> 

        </div> 
       </div> 
      </div> 

は私custom.jsコードがあるURLに "process.php"：「index.phpを"process.phpコードをindex.phpファイルに入れると、クエリが機能しています。それ以外の場合は、クエリも機能していません。ここで

$("#updateForm").submit(function(event){ 
// cancels the form submission 
event.preventDefault(); 
submitUpdateForm(); 
}); 

function submitUpdateForm(){ 
$.ajax({ 
    type: "POST", 
    url: "process.php", 
    data: $('#updateForm').serialize(), 
    success : function(text){ 
     if (text == "pass"){ 
      updateFormSuccess(); 
     } 
     else { 
      updateFormFailure(); 
     } 
    }, 
    error: function(){ 
    alert("failure"); 
    } 
}); 
} 

function updateFormSuccess(){ 
alert("Success"); 
$("#thanks").removeClass("hidden"); 
} 

function updateFormFailure(){ 
$("#thanks").html("Fail"); 
} 

はprocess.phpコードです：

include('config.php'); //include the database connection 
if ('POST' === $_SERVER['REQUEST_METHOD']) { 
$userID = $_POST['userID']; 
$customer_name = $_POST['customer_name']; 
$results = mysqli_query($con, "UPDATE users SET fullName='$customer_name'   WHERE userId=".$userID); 

if ($results) { 
    echo "pass"; 
}else{ 
    echo "invalid"; 
} 
} 

私はAJAX呼び出しがまったく機能していないことが判明した後のトラブルシューティング。誰も私が間違っていることを私に案内してくれる？あなたのupdateFormSuccess()関数の最後に次の行を追加し、提出する。：

document.location.reload();

ページをリロードします成功した時にページを更新する

Answer 1

。ここからですMDN：

Location.reload（）メソッドは、現在のURLからリソースを再読み込みします。そのオプションの一意のパラメータはブール値であり、真である場合にページが常にサーバーから再ロードされます。 falseまたは指定されていない場合、ブラウザはキャッシュからページをリロードすることがあります。 forcedReloadフラグは、一部のブラウザがスクロール位置を処理する方法にも影響します。通常のリロードでは、ページDOMを再ロードした後にスクロール位置を復元しようとしますが、強制モード（パラメータがtrueに設定されている場合）では新しいDOMはscrollTop == 0 。