在删除一行后进入相同的数据页


Getting into the same data page after a deletion of a row

我有一个表,它显示了特定日期的行数。我想删除一行后,回到同一页,并显示相同的日期相同的行。例如:如果我有2行日期为06/06/2015,我删除了其中一行,我想回到同一页面并查看另一行。我有这些代码:

Delete.php:

<?php 
require_once ('../include/global.php');
$id=$_REQUEST['id'];
$sql = "DELETE FROM appoint WHERE id=".$id;
$result=mysqli_query($con,$sql) or die('Unable to execute query. '. mysqli_error($con));
if($result){
    $sql2 = "SELECT date FROM appoint WHERE id=".$id;
    $result2=mysqli_query($con,$sql2) or die('Unable to execute query. '. mysqli_error($con)); 
    $rows = mysqli_fetch_array($con, $result2);
    header("location:appoint.php");

}
else { 
header("location:../update/update_false.php");
}
?>

getdata.php:

<?php
require_once ('../include/global.php');
    if($_POST['seldate']) {
        $selDate = $_POST['seldate'];
        $sql="SELECT * FROM clinic.appoint WHERE date='$selDate'";
        $result = mysqli_query($con, $sql) or die($sql."<br/><br/>".mysql_error());
        while($rows=mysqli_fetch_array($result)){
    ?>
<tr>
    <td scope="row"><?php echo $rows['time'] ?></td>
    <td scope="row"><?php echo $rows['name'] ?></td>
    <td scope="row"><?php echo $rows['date'] ?></td>
    <td scope="row"><form action='/clinic form/appoint/delete.php'=<?php echo $rows['id']; ?>' method="post">
        <input type="hidden" name="id" value="<?php echo $rows['id']; ?>">
        <input type="submit" name="submit1" value="Done">
    </form>
    </td>
    </tr>
<?php } } ?>

和数据显示表页面appointment .php:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function(){
    $("#Date").change(function(){
            var seldate =$(this).val();
            $("#scheduleDate").html(seldate);
            var dataString = 'seldate='+ seldate;
                $.ajax({
                type: "POST",
                url: "getdata.php",
                data: dataString,
                cache: false,
                success: function(data) {
                    $("#Schedule").html(data);
                } 
            });
        });
});
</script>
</head>
<body>
<div class="container12">
    <header>
        <div align="center">
            <div class="column12"> <a href="homepage.php"><img src="images/logo.png"/></a> </div>
        </div>
        <div align="center">
            <div align="center"><a href="logout.php">Logout</a></div>
        </div>
    </header>
    <h1 id="home">&nbsp;</h1>
    <div class="alert"></div>
    <div class="column12" align="left"><B><center>Appointments</B></center><br />
    </div> 
    </div>
  </div>
</div>
<div class="container12" align="center">
    <form action="addApp.php" method="post" name="form1" id="form1">
    <table width="700px" class="imagetable" align="center">
    <th align="center">Name</th>
    <th>Date</th>
    <th>Time</th>
    <th>Contact Number</th>
    <th>Action</th>
    <tr>
    <td><input type="text" name="name" class="large-fld-app" placeholder="name"/></td>
    <td><input type="text" name="date" class="large-fld-app" placeholder="DD/MM/YYYY"/></td>
    <td><input type="time" name="time" class="large-fld-app"/></td>
    <td><input type="text" name="phone" class="large-fld-app"/></td>
    <td align="center"><input type="submit" value="" name="submit" class="imgClass_save" />
    </td>
    </tr>
    </table>
    </form>
</div>
<?php
//$sql="SELECT * FROM clinic.appoint";
//$result = mysqli_query($con, $sql) or die($sql."<br/><br/>".mysql_error());
//$rows=mysqli_fetch_array($result)
?>
<div class="container">
<table>
          <thead>
            <tr>
            Schedule
                <th scope="row">
                    <select name="Date" required class="form-control" id="Date">
                    <option value="">Please Select Date</option>
                    <?php $sql2="SELECT * FROM clinic.appoint GROUP BY date";
                    $result2 = mysqli_query($con, $sql2) or die($sql2."<br/><br/>".mysql_error());
                    while($rows2=mysqli_fetch_array($result2)){?>
                        <option value="<?php echo $rows2['date'] ?>"><?php echo $rows2['date'] ?></option>
                    <?php } ?>
                    </select>
                </th>
                <td class="schedule-offset" colspan="2" id="scheduleDate"></td>
            </tr>
          </thead>
          <tbody id="Schedule"></tbody>
</table>
</div>
</body>
</html>

这是一个快速的解决方案:将ajax部分放入函数中。

修改PHP代码:

require_once ('../include/global.php');
$id = $_REQUEST['id'];
# Find the date for which you are deleting...
$query = "SELECT date FROM appoint WHERE id = " . $id;
$row = mysqli_fetch_assoc(mysqli_query($con, $query));
$request_date = $row['date'];
$sql = "DELETE FROM appoint WHERE id=".$id;
$result = mysqli_query($con,$sql) or die('Unable to execute query. '. mysqli_error($con));
if($result){
    header("Location: appoint.php?date=" . $request_date);
}
else { 
    header("Location: ../update/update_false.php");
}

当你从delete返回时,你有一个$_GET['date']。但是当你第一次加载页面时,你没有这个。

现在修改你的JS以适应它。将AJAX部分放在函数中。

$(document).ready(function(){
    $("#Date").change(function(){
        var seldate =$(this).val();
        display_data(seldate);
    });
    // This is the function...
    function display_data(seldate) {
        $("#scheduleDate").html(seldate);
        var dataString = 'seldate='+ seldate;
            $.ajax({
            type: "POST",
            url: "getdata.php",
            data: dataString,
            cache: false,
            success: function(data) {
                $("#Schedule").html(data);
            } 
        });
    }
    // Now here is the real code for retaining your Date...
    <?php
    if (!empty($_GET['date'])) {
        ?>
    display_data('<?php echo $_GET["date"]; ?>')
        <?php
    }
    ?>
    document.getElementById('Date').value = '<?php echo @$_GET["date"]; ?>';
});

现在您只需要在dom准备好后的特定日期调用display_data()函数。

你也可以使用会话:

示例:在我的php代码存储$request_date在一个会话

第一次启动会话如果你还没有启动它session_start()。在所有页面中,HTML和DELETE PHP和UPDATE FAIL页面。

$request_date = $row['date'];
$_SESSION['date'] = $request_date;

并将重定向部分更改回您的代码。

header("Location: appoint.php");

现在改变我的脚本块的这一部分:

来自:

<?php
if (!empty($_GET['date'])) {
    ?>
    display_data('<?php echo $_GET["date"]; ?>');
    <?php
}
?>
document.getElementById('Date').value = '<?php echo @$_GET["date"]; ?>';

:

<?php
if (!empty($_SESSION['date'])) {
    ?>
    display_data('<?php echo $_SESSION["date"]; ?>');
    <?php
    unset($_SESSION['date']);
}
?>
document.getElementById('Date').value = '<?php echo @$_SESSION["date"]; ?>';

使用session的优点是,如果您有一个删除失败,并被重定向到Update fail页面。之后,当您再次回到列表页面时。

从Ajax调用后张贴是不可能检索的数据,你第一次取与Ajax方法,所以你需要另一个Ajax方法从数据库中删除记录。

首先替换这个

<form action='/clinic form/appoint/delete.php'=<?php echo $rows['id']; ?>' method="post">
    <input type="hidden" name="id" value="<?php echo $rows['id']; ?>">
    <input type="submit" name="submit1" value="Done">
</form>

in getdata.php with this

<button type="button" class="DelMe" data-id="<?php echo $rows['id']; ?>">Delete Me</button>

然后在相同的getdata.php中,你有<tr>添加一个类到它<tr class="deleted">,最后你有<?php } } ?>做出以下更改,并把一个删除Ajax方法调用在它,所以当你从数据库中获取记录删除Ajax方法调用将加载数据,并将是DOM准备。

<?php } ?>
    <script>
    $(document).ready(function(){
        $(".DelMe").on('click', function(){
                var DelId =$(this).data('id');     
                var dataString = 'DelId='+ DelId;
                    $.ajax({
                    type: "POST",
                    url: "delete.php",
                    data: dataString,
                    cache: false,
                    success: function(msg) {
                        $(this).parents(".deleted").hide(500);
                    } 
                });
            });
    });
    </script>
<?php } ?>

最终的getdata.php将是这样的

<?php require_once ('../include/global.php');
    if($_POST['seldate']) {
        $selDate = $_POST['seldate'];
        $sql="SELECT * FROM clinic.appoint WHERE date='$selDate'";
        $result = mysqli_query($con, $sql) or die($sql."<br/><br/>".mysql_error());
        while($rows=mysqli_fetch_array($result)){
    ?>
    <tr class="deleted">
        <td scope="row"><?php echo $rows['time'] ?></td>
        <td scope="row"><?php echo $rows['name'] ?></td>
        <td scope="row"><?php echo $rows['date'] ?></td>
        <td scope="row"><button type="button" class="DelMe" data-id="<?php echo $rows['id']; ?>">Delete Me</button></td>
    </tr>
<?php } ?>
<script>
$(document).ready(function(){
    $(".DelMe").on('click', function(){
            var DelId =$(this).data('id');       
            var dataString = 'DelId='+ DelId;
                $.ajax({
                type: "POST",
                url: "delete.php",
                data: dataString,
                cache: false,
                success: function(msg) {
                    $(this).parents(".deleted").hide(500);
                } 
            });
        });
});
</script>
<?php } ?>

现在创建新的PHP文件并命名为delete.php

<?php require_once ('../include/global.php');
    if($_POST['DelId']) {
        $DelId = $_POST['DelId'];
        $sql="DELETE FROM appoint WHERE id='$DelId'";
        $result = mysqli_query($con, $sql) or die($sql."<br/><br/>".mysql_error());
        $rowcount=mysqli_num_rows($result);
        if ($rowcount > 0) {
            echo "success";
        } else {
            echo "false";
        }   
    } 
?>

当行被删除时,它将对用户隐藏