如何將 $_GET 變數傳遞給 Bootstrap 模態？

如何將$_GET 變數從連結傳遞到Bootstrap 模態

將$_GET 變數從連結傳遞到Bootstrap 模態至關重要用於修改和顯示模式中的特定資料。以下是幾個實現此目的的解決方案：

簡單解決方案

• 模態呼叫按鈕：

  <td data-placement="top" data-toggle="tooltip" title="Show">
  <a class="btn btn-primary btn-xs" data-toggle="modal" data-target="#editBox" href="file.php?id=<;?php echo $obj->id; ?>"">
    <span class="glyphicon glyphicon-pencil"></span>
  </a>
  </td>

• 莫代爾HTML:

  <div class="modal fade">

• file.php

  $Id = $_GET["id"]; // Escape the string if needed
  // Run query to fetch records against $Id
  // Show records in modal body

替代解決方案Ajax和 Bootstrap模態事件監聽器

• 模態呼叫按鈕：

  <td data-placement="top" data-toggle="tooltip" title="Show">
  <a class="btn btn-primary btn-xs" data-toggle="modal" data-target="#editBox" data-id="<php echo $obj->id; ?>">
    <span class="glyphicon glyphicon-pencil"></span>
  </a>
  </td>

• 模態HTML:

  <div class="modal fade">

• 腳本：

  $( document ).ready(function() {
  $('#myModal').on('show.bs.modal', function (e) {
    var id = $(e.relatedTarget).data('id');
    $.ajax({
      type : 'post',
      url : 'file.php', // Fetches records
      data : 'post_id='+ id,
      success : function(data) {
        $('.form-data').html(data); // Shows fetched data in modal body
      }
    });
  });
  });

腳本：

• if ($_POST['id']) {
  $id = $_POST['id'];
  // Run query to fetch records
  // Echo the data to be displayed in the modal
  }

file.php

• 備用使用 Ajax 和 jQuery Click功能的解決方案

  <td data-placement="top" data-toggle="tooltip" title="Show">
  <a class="btn btn-primary btn-xs open-modal" href="">

模態呼叫按鈕：

• <div class="modal fade">

莫代爾HTML:

• $( document ).ready(function() {
  $('.open-modal').click(function(){
    var id = $(this).attr('id');
    $.ajax({
      type : 'post',
      url : 'file.php', // Fetches records
      data : 'post_id='+ id,
      success : function(data) {
        $('#editBox').show('show');
        $('.form-data').html(data);
      }
    });
  });
  });

腳本：

• 腳本：

  if ($_POST['id']) {
  $id = $_POST['id'];
  // Run query to fetch records
  // Echo the data to be displayed in the modal
  }

file.php

• 透過頁面資訊到模態

  <td data-placement="top" data-toggle="tooltip" title="Show">
  <a data-book-id="<php echo $obj->id; ?>" data-name="<php echo $obj->name; ?>" data-email="<php echo $obj->email; ?>" class="btn btn-primary btn-xs" data-toggle="modal" data-target="#editBox">
    <span class="glyphicon glyphicon-pencil"></span>
  </a>
  </td>

• 透過頁面資訊到模態

  $(document).ready(function(){
  $('#editBox').on('show.bs.modal', function (e) {
    var bookid = $(e.relatedTarget).data('book-id');
    var name = $(e.relatedTarget).data('name');
    var email = $(e.relatedTarget).data('email');
    // Can pass as many on-page values to modal
  });
  });

模態呼叫按鈕：

模態事件：透過這些解決這些方案之一，您可以有效地將$_GET 變數從連結傳遞到 Bootstrap 模式，從而允許您動態載入和操作資料在模態視窗內。

以上是如何將 $_GET 變數傳遞給 Bootstrap 模態？的詳細內容。更多資訊請關注PHP中文網其他相關文章！