XMLhttprequest对象不起作用,以及如何避免在提交时刷新页面

时间:2019-06-07 11:36:04

标签: javascript php ajax

我有两个文件,一个是editprofile.html,另一个是edit.php。我正在尝试编辑/更新记录并再次显示该记录。我使用XMLHttpRequest对象是因为我想使用Ajax显示在当前页面的某些部分。

问题-它不更新,并且刷新屏幕,并在我第一次加载editprofile时使我回到原始状态。我需要知道 (1)为什么它不更新并执行“如果…是edit.php文件的一部分”,并且 (2)如何避免每次单击“更新”(提交)按钮时刷新并清除完整页面!以下是这两个文件的代码:

感谢任何人都可以让我知道并解释我哪里出错了。非常感谢。

editprofile.html文件

....

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Patient Profile</title>
</head>
<body>

<div class="main">
    <div class="hist_wrapper0"> 
      <div class="patient_left">    
      <h1>The XMLHttpRequest Object</h1>
      <form action='' method='post' onclick="showProfile(updp.value)">
          <p class="quest1"> Do you want to update the patient data? :
              <input type="radio" name="updp" id="updyes"  value="Yes" > Yes
              <input type="radio" name="updp" id="updno"  value="No" checked> No
         </p>
       </form>
        <div id="txtHint0"> Display at this point....     
    </div>
    </div>
</div>  

<script>

 function showProfile(str) { 
  var xhttp;  
  xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      document.getElementById("txtHint0").innerHTML = this.responseText;}
                                        };
  xhttp.open("GET", "edit.php", true);
  xhttp.send();
}
</script>   
</body>
</html>

....

edit.php文件

....

<?php

$con = mysqli_connect("localhost","root","","medical_camps");
// Check connection
if (mysqli_connect_errno())
  {echo "Failed to connect to MySQL: " . mysqli_connect_error();}

$id=5;                          // assign 5 for testing
$icnumber="12345678955555";     //  assign number that is in database

// Read data record from database and assigned to $row

    $query = "SELECT patient.id, patient.patient_name, patient.ic_num, patient.gender,  patient.dob 
              FROM patient where patient.ic_num='$icnumber'" ;
    $result = mysqli_query($con, $query) or die ( mysqli_error($con));
    $row = mysqli_fetch_assoc($result);
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Update Record</title>

</head>
<body>  
<div class="form">

    <h1>Update Data</h1>
    <?php

    $status = "";
    if(isset($_POST['new']) && $_POST['new']==1){
        $id=$_REQUEST['id'];                    
        $name =$_REQUEST['name'];                 
        $gender =$_REQUEST['gender'];                   
        $dob = $_REQUEST['dob'];                                     
        $update="update patient set patient_name='".$name."', gender='".$gender."', dob='".$dob."' where patient.ic_num='".$icnumber."'";           
        mysqli_query($con, $update) or die(mysqli_error());
        $status = "Record Updated Successfully. </br></br><a href='view.php'>View Updated Record</a>";
        echo '<p style="color:#FF0000;">'.$status.'</p>';}
    else {?>
            <form name="form" method="post" action=""> 
            <input type="hidden" name="new" value="1" />
            <input name="id" type="hidden" value="<?php echo $row['id'];?>" />
            <span class="inline">
                <label class="labeltag">Name: </label><input type="text" name="name" size="35" placeholder="Enter Name" required value="<?php echo $row['patient_name'];?>" >
                <label class="labeltag">IC-Num: </label><input type="text" name="icnum"  maxlength="14" size="12" placeholder="Enter IC-Num" required value="<?php echo $row['ic_num'];?>" >
            </span>
            <br />
            <span class="inline">
                <label class="labeltag">Gender: </label><input type="text" name="gender" size="5" placeholder="Enter Gender" required value="<?php echo $row['gender'];?>" >
                <label class="labeltag">Dob: </label><input type="text" name="dob" size="12" placeholder="Enter Dob (YYYY-MM-DD)" required value="<?php echo $row['dob'];?>" >
            </span>
                <p><input id="submit" name="submit" type="submit" value="Update" ></p>
            </form>
        <?php } ?>
</div>
</body>
</html>

....

0 个答案:

没有答案