如何將ID從boostrap中的模態傳遞到PHP文件

Question

我試圖將id值從php傳遞給modal。 我嘗試發送的id來自循環。 所以我試圖使用ajax發送值。 我要發送的值顯示在控制台中，但不會顯示在瀏覽器中。 我檢查了網絡tab ，可以看到帶有所需id的URL完整。 以下是到目前為止我嘗試過的代碼。

 $(".manage_permission_button").click(function() { var user_id = $(this).attr('user_id'); $.ajax({ type: 'GET', url: 'assets/pages/manage_users/modal_content_manage_users.php', data: { user_id: user_id }, success: function(response) { console.log(response); alert(response); $('#myModal').modal('toggle'); }, }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <button user_id="<?php echo $value['_id'];?>" type="button" class="btn btn-primary btn-xs manage_permission_button">Manage Permission</button> 

 <?php echo $a=$_GET['user_id'];?> 

編輯1：正如您在圖像中看到的那樣，該值未在PHP代碼中獲取，而是在控制台中顯示，並且當我實際轉到該特定URL時

編輯2：這是模式代碼

 <div class="modal fade" id="myModal" role="dialog"> <div class="modal-dialog"> <!-- Modal content--> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">&times;</button> <h4 class="modal-title">Manage Permissions <?php echo $a=$_REQUEST['user_id'];?></h4> </div> <div class="modal-body"> <div class="row"> <form action="" method="POST"> <?php include 'permissions.php';?> <!-- END TABLE STRIPED --> <div class="container-fluid"> <button type="submit" class="btn btn-primary" name="btn_user_permissions">Submit</button> </div> </form> </div> </div> </div> </div> </div> </div> 

Answer 1

$(".manage_permission_button").click(function() {
  var user_id = $(this).attr('user_id');
  $.ajax({
    type: 'GET',
    url: 'assets/pages/manage_users/modal_content_manage_users.php?user_id='+user_id,
    dataType: "html",       
    success: function(response) {
      console.log(response);
      alert(response);
      $('#myModal').modal('toggle');
    },
  });
});

這應該工作一次！ 更新我的答案

Answer 2

您具有單擊button user_id ，因此無需調用ajax。

如果要以模式顯示用戶ID，請執行以下操作

$(".manage_permission_button").click(function() {
    var user_id = $(this).attr('user_id');
    $('#myModal .elementToShowId').html(user_id);
    $('#myModal').modal('toggle');
});

因此，現在當您單擊帶有類manage_permission_button的按鈕時，您將打開模式並使用js插入ID。 不需要ajax。

編輯

$(".manage_permission_button").click(function() {
    var user_id = $(this).attr('user_id');
    $('#myModal .modal-title').html("Manage Permissions " + user_id);
    $('#myModal').modal('toggle');
});

這應該工作。 試試吧。

編輯2

如果您真的想使用ajax，則可以使用ajax獲得模態。

為此，將模式代碼移動到單獨的文件，例如myModal.php並回顯它。

然后在js中做類似的事情

$(".manage_permission_button").click(function() {
    var button = $(this),
        user_id = button.attr('user_id');

    $.ajax({
        type: 'GET',
        url: 'assets/pages/manage_users/myModal.php',
        data: {
            user_id: user_id
        },
        success: function(response) {
            $(response).insertAfter(button);
            $('#myModal').modal('show');
        },
    });
});

$('#myModal').on('hidden.bs.modal', function () {
    $(this).remove();
});

但是我不推薦這種方法。 不需要使用ajax。

Answer 3

@Krzysztof Janiszewski的答案是正確的。 在您的情況下，js代碼將是：

$(".manage_permission_button").click(function() {
  var user_id = $(this).attr('user_id');
  $('#myModal .modal-title').text('Manage Permissions ' + user_id);
  $('#myModal').modal('toggle');
});

順便說一句，我認為您應該按照您的php文件modal_content_manage_users.php中的表格來編輯表格中的表格。 而且可能還需要將user_id傳遞到隱藏的輸入中。