如何在不刷新页面的情况下从 php 函数中的 url 传递 id？

Question

我有一个 div，其中包含一个按钮（预订它）。当我按下按钮时，我想将我点击的项目的 id 添加到当前 url。然后让该 id 弹出一个带有点击项目的框数据不刷新页面，因为我需要在当前页面弹出。

这里获取治疗 ID

 <div class="treatments">
        <ul>
        <?php
          global $treatments;
          foreach($treatments as $treatment){
            echo ' <li><a href="treatments.php?treatmentID='.$treatment['id'].' #treatmentItem" style="color: inherit; text-decoration:none;">'.$treatment['name'].'</a></li>';
          };
        ?>
        </ul>
        <div class="line"></div>
      </div>

<div class="treatment-items">
        <?php 
         global $iController;
         $items;
         if(isset($_GET['treatmentID'])){
            $items = $iController->getItemByTreatmentId($_GET['treatmentID']); 
         }else{
            $items = $iController->getItemByTreatmentId(4); 
         }
         foreach($items as $item){
           echo '
           <div class="col-30 items">
            <div>
            <p>'.$item['id'].'</p>
              <img src="'.$item['img_url'].'" alt="'.$item['name'].'" />
              <h3>'.$item['name'].'</h3>
              <p>'.$item['time'].' min</p>
              <p>'.$item['price'].'$</p>
              <input type="hidden" id="hidden_input" name="id_item" value="'.$item['id'].'">
              <a class="bookBtn" id="btn"><button>BOOK IT</button></a>   // when I press this button I want that box to pop up 
            </div>
           </div>
           ';
         }
        ?>
      </div>

弹出框

 <div class="bookDetails">
        <div class="details">
          <?php
          global $iController;
          $itemm;
          if(isset($_GET['id_item'])){
            $itemm = $iController->getItemById($_GET['id_item']); 
          }
          echo'
            <h1>Book your treatment</h1>
            <p>Treatment Name : '.$itemm['name'].'</p>
            <p>Treatment Time :'.$itemm['time'].' </p>
            <p>Treatment Price : '.$itemm['price'].'</p>
            ';
          ?>  
              <form action="" method="POST">
              <label for="date">Choose your date:</label>
              <input type="date" for="date" name="date"><br>
              <input type="submit" value="Cancel" id="cancel">
              <input type="submit" value="Book Now">
          </form>

jQuery 代码

  $(".bookBtn").click(function(){
      $(".bookDetails").show();
    })

getItemById 函数

 public function getItemById($id){
        $sql="SELECT * FROM treatments_item WHERE id=$id";
        echo $id;
        $items = mysqli_query($this->connection,$sql);
        $returnArray = array();
        if($items){
            while($row = mysqli_fetch_assoc($items)){
                array_push($returnArray, $row);
            }     
            return $returnArray[0];

        }else{
            echo'It doesn't work';
        }
    }

Answer 1

您可以像这样使用 ajax 或混合使用 php 和 javascript：

<script>
  $(document).ready(function() {
    <?php session_start(); ?>//Remove session_start
    if (!<?php $_GET(['id'])?'true':'false'; ?>) {
      alert something
    } else {
      something ..
    }

  });
</script>

希望这对您有所帮助。 :)

Answer 2

<div class="treatment-items">
<?php 
    global $iController;
    $items;
    if(isset($_GET['treatmentID'])){
        $items = $iController->getItemByTreatmentId($_GET['treatmentID']); 
    }else{
        $items = $iController->getItemByTreatmentId(4); 
    }
    foreach($items as $item){
        echo '
        <div class="col-30 items">
        <div>
        <p>'.$item['id'].'</p>
        <img src="'.$item['img_url'].'" alt="'.$item['name'].'" />
        <h3>'.$item['name'].'</h3>
        <p>'.$item['time'].' min</p>
        <p>'.$item['price'].'$</p>
        <input type="hidden" class="id_item" value="'.$item['id'].'">
        <div class="bookBtn"><button>BOOK IT</button></div>   // when I press this button I want that box to pop up 
        </div>
        </div>
        ';
    }
?>

注意：切勿在一个页面中使用 id 同名，即 id="hidden_​​input" // 在 for 循环中将生成同名。它将产生错误。输入名称也是如此，而是使用类。

$(document).ready(function(){
    $('body').on('click','.bookBtn',function(){
        var treatmentID = $(this).siblings('.id_item').val();
        // $(this) --> it will read the data of the property you have clicked
        // .siblings --> adjacent class with name ('.id_item')
        $.ajax({
            url: 'treatments.php',
            type: "get", //send it through get method
            data: { 
                treatmentID: treatmentID
            },
            success: function(response) {
                //operation to show the data in div
                //e.g., $('#divId').html(data.name);
                $(".bookDetails").show();            
            }
        });
    })
})