$_GET 변수를 링크에서 부트스트랩 모달로 전달하는 방법은 무엇입니까?

링크에서 부트스트랩 모달로 $_GET 변수 전달

부트스트랩 모달의 맥락에서 링크에서 $_GET 변수를 성공적으로 전달하려면 다음이 필요합니다. 신중한 접근. 이 문서에서는 이 작업을 수행하기 위한 다양한 방법을 제시하며 각 방법에는 고유한 장점과 고려 사항이 있습니다.

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>

모달 HTML에서 GET 매개변수를 통해 전달된 ID를 기반으로 데이터베이스에서 레코드를 가져와 모달 내에 표시합니다.

대체 해결 방법 Ajax 및 Bootstrap 모달 이벤트 리스너 사용:

이 솔루션은 Bootstrap 모달 이벤트 리스너를 사용하여 별도의 PHP 파일을 사용하지 않고 모달에 ID를 전달합니다. 모달 호출 버튼의 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>

모달의 JavaScript 이벤트 핸들러에서 ID를 사용하여 Ajax를 통해 데이터를 가져와 표시합니다.

Ajax 및 jQuery 클릭 기능을 사용한 대체 솔루션:

이 솔루션은 jQuery의 클릭 기능을 활용하여 Ajax 호출을 시작하여 필요한 데이터를 가져오고 표시합니다. 모달 호출 버튼의 HTML에서 다음과 같이 앵커 태그를 수정합니다.

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

별도의 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
      }
    });
  });
});

페이지 정보를 모달에 전달:

최소한의 페이지 정보를 모달에 표시해야 하는 경우 Ajax를 사용하지 않고도 이를 수행할 수 있습니다. 모달 호출 버튼의 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>

관련 모달 이벤트 핸들러에서 다음과 같이 전달된 값에 액세스합니다.

$('#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 변수를 링크에서 부트스트랩 모달로 전달하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!