用新图像重新加载DIV

时间:2018-12-31 22:41:04

标签: php ajax

我有一个员工数据库,其中包含图像及其工作位置(专业)。我创建了一个页面,在其中填写表格并将图像上载到目录和数据库路径。然后,我加载主页,从数据库中提取所有图像(进入“照片” DIV。一切正常。

我想做的是基于来自按钮的MySQL查询,将图像重新加载到DIV中。例如,除了显示所有员工外,我只想查看具有特定工作职能(即管理)的人员。目前,我可以通过重定向到新页面来完成此操作,在该页面上运行特定查询,效果也很好。但是,我想了解如何做到这一点而无需为每个查询创建新页面。我花了很多时间看AJAX和PHP教程,这些教程使我能够完成自己的工作,但是找不到找到所需方法的方法。这是我的代码的相关部分:

Main.php

<div class="container-fluid">
<div class="row">
<div class ="col-lg-12"  style="width: 18%; height: 100%; border:3px solid red;">

<a href = "management.php" class="btn btn-primary">MANAGEMENT</a>
<a href = "high.php" class="btn btn-primary">HIGH</a>

</div>
<?php
 include ('db_connect.php');
 //include_once ('functions.php');

 $result = $db->query("SELECT * from monctonfir order by initials ASC");

 if($result->num_rows > 0){
    while ($row = $result->fetch_assoc()){
        $imageURL = 'image/'.$row["file"];
        $initial = $row["initials"];
        $name = $row["name"];
    ?>




    <div id="photos" class = "col-lg-1 no-gutters" style="margin-top:1rem;">
    <div class="card text-center" style="width: 5rem;">
    <a href = "#">
        <img class="img card-img-top" src = "<?php echo $imageURL ?>"> 
    </a>
    <div class = "card-body">
        <h5 class = "card-title round-button" style="text-align: center;"><?php echo $initial  ?></h5>
    </div>

    </div>
    </div>

    <?php }
 } ?>

</div>

有人可以指出我正确的方向吗? 谢谢!

2 个答案:

答案 0 :(得分:0)

最简单的方法是使用Jquery的load函数 Jquery 例如:

$( "#divID" ).load( "loadEmploye.php", { parameters1: 25, parameters2:3 });

答案 1 :(得分:0)

您无需使用jQuery即可完成工作。您可以使用查询/ GET参数来构建您的sql,因此您不必创建其他页面。喜欢:

<div class="container-fluid">
    <div class="row">
        <div class ="col-lg-12"  style="width: 18%; height: 100%; border:3px solid red;">

            <a href = "?job=management" class="btn btn-primary">MANAGEMENT</a>
            <a href = "?job=high" class="btn btn-primary">HIGH</a>
            <a href = "?" class="btn btn-primary">ALL</a>

        </div>
        <?php
        include ('db_connect.php');
        //include_once ('functions.php');

        $sql = "SELECT * from monctonfir WHERE 1 ";

        if(isset($_GET['job'])) $sql .= " AND job = '".$_GET['job']."' ";


        $sql .= " order by initials ASC";

        $result = $db->query($sql);

        if($result->num_rows > 0){
            while ($row = $result->fetch_assoc()){
                $imageURL = 'image/'.$row["file"];
                $initial = $row["initials"];
                $name = $row["name"];
                ?>




                <div id="photos" class = "col-lg-1 no-gutters" style="margin-top:1rem;">
                    <div class="card text-center" style="width: 5rem;">
                        <a href = "#">
                            <img class="img card-img-top" src = "<?php echo $imageURL ?>">
                        </a>
                        <div class = "card-body">
                            <h5 class = "card-title round-button" style="text-align: center;"><?php echo $initial  ?></h5>
                        </div>

                    </div>
                </div>

            <?php }
        } ?>

    </div>