Question

我正在尝试制作一个计划页面，其中我有一个名为约会的sql表，其中包含（id，name，date，time）。我想在基于html / css的表格中重新组合此表格中的数据，以便将同一日期的所有记录重新分组，如下图所示

然后，我希望这个表重复一遍，但是要了解新日期的新数据。我有另一个问题是空下拉列表，我试图回显其中的所有日期，并且用户选择日期来查看日程安排。我试图编辑它的代码在这个链接中：

我有这段代码：

set.seed(123) #just for reproducibility

x <- 1:10
y <- sample.int(5,10,replace=TRUE)
gender <- sample(0:1,10,replace=TRUE)

# here we map 0 -> 'blue' and 1 -> 'pink'
# pch=16 prints a full bullet as point character
plot(x=x, y=y, col=c('blue','pink')[gender+1], pch=16)

要点：我想从下拉列表中选择一个日期，然后这个特定列表的所有数据都显示在这种类型的html表中。但是我两个都有问题（进入下拉，并将数据回显到这种类型的表中）。

Answer 1

1）我想从下拉列表中选择一个日期

<select name="Date" required class="form-control" id="Date">
    <option value="">Please Select Date</option>
    <?php $sql="SELECT * FROM clinic.appoint";
    $result = mysqli_query($con, $sql) or die($sql."<br/><br/>".mysql_error());
    while($rows=mysqli_fetch_array($result)){?>
    <option value="<?php echo $rows['date'] ?>"><?php echo $rows['date'] ?></option>
    <?php } ?>
</select>

2）然后，此特定列表的所有数据都显示在此类HTML表格中。

您需要jQuery Change function和Ajax method来获取数据并根据所选日期进行展示

$(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);
                } 
            });
        });
});

创建getdata.php

<?php
    //Datebase Connection
    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['name'] ?></td>
        <td scope="row"><?php echo $rows['date'] ?></td>
    </tr>
<?php } } ?>

HTML表格看起来像

<table>
    <thead>
    <tr>
        Schedule
        <th scope="row">
            //Date Select HERE
        </th>
        <td class="schedule-offset" colspan="2" id="scheduleDate"></td>
    </tr>
    </thead>
    <tbody id="Schedule">
    </tbody>
</table>

使用php制作计划页面

1 个答案: