將$_GET 變數(shù)從連結(jié)傳遞到Bootstrap 模態(tài)

在Bootstrap 模態(tài)上下文中，成功從連結(jié)傳遞需要$_GET 變數(shù)需要$_GET 變數(shù)需要$_GET 變數(shù)。謹(jǐn)慎的做法。本文介紹了完成此任務(wù)的各種方法，每種方法都有自己的優(yōu)點(diǎn)和注意事項。

使用PHP 檔案的簡單解決方案：

此解決方案涉及在您的HTML程式碼：

<td><span 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></span></td>

在模態(tài)HTML中，根據(jù)GET參數(shù)傳遞的ID從資料庫中取得記錄，並顯示它們

使用Ajax 和 Bootstrap 模態(tài)事件監(jiān)聽器的替代解決方案：

此解決方案使用 Bootstrap 模態(tài)事件監(jiān)聽器將 ID 傳遞給模態(tài)，而不使用單獨(dú)的 PHP 檔案。在模態(tài)呼叫按鈕的HTML 中，將href 屬性替換為data-id 屬性以傳遞行的ID：

<td><span 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></span></td>

在模態(tài)的JavaScript 事件處理程序中，使用ID 透過Ajax 取得資料並顯示它在模式中。

使用 Ajax 和 jQuery Click 的替代解決方案功能：

此解決方案利用 jQuery 的點(diǎn)選功能來啟動 Ajax 呼叫以取得並顯示必要的資料。在模態(tài)呼叫按鈕的 HTML 中，修改錨標(biāo)記如下：

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

在單獨(dú)的 JavaScript 檔案中，編寫以下 Ajax 程式碼來取得並顯示資料：

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

將頁面資訊傳遞到模態(tài)：

在需要最少頁面資訊的情況下要在模態(tài)中顯示，您可以在不使用 Ajax 的情況下實(shí)現(xiàn)此目的。在模態(tài)呼叫按鈕的 HTML 中，使用資料屬性來傳遞值：

<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>

在相關(guān)的模態(tài)事件處理程序中，如下存取傳遞的值：

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

以上是如何將 $_GET 變數(shù)從連結(jié)傳遞到 Bootstrap 模態(tài)？的詳細(xì)內(nèi)容。更多資訊請關(guān)注PHP中文網(wǎng)其他相關(guān)文章！