將數據ID傳遞到引導模式的問題

我有一個包含鏈接按鈕的列表頁面，用於顯示PHP循環中的模態重複。我已搜索並找到這些： Passing data to a bootstrap modal，Passing data to Bootstrap 3 Modal和Pass id to Bootstrap modal和其他一些但失敗。將數據ID傳遞到引導模式的問題

我想

我已經賺得了從數據庫中的數據ID，並通過它來引導模式，並在那裏我會用這個ID通過MySQL的查詢，以顯示更多的信息。

我寫了所有的代碼，但ID沒有傳遞給模態。

莫代爾鏈接按鈕的代碼

<a class="btn btn-warning btn-minier" href="#modal-form-show" role="button" data-toggle="modal" data-target="#myModal" data-id="<?php echo $cottage_id ?>"><i class="icon-edit bigger-120"></i> Reservation </a>

模態代碼

<!-- Modal --> 
    <div id="myModal" class="modal fade" 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">Reservation Details</h4><br> 
      <h5>Cottage Id :</h5> 
      <h5>Cottage Title :</h5> 

      </div> 
      <div class="modal-body"> 
      <p>ID WILL SHOW IN THIS TEXT FIELD. 
      <input type="text" name="cottage" placeholder="cottage id" value="" id="cottage" /> 
      </p> 
      </div> 
      <div class="modal-footer"> 
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
      </div> 
     </div>

JS代碼

$('#modal-form-show').on('show.bs.modal', function(e) { 
    var c_id= $('a[href="#modal-form-show"]').data('id'); 
    //var c_id= $(this).data(id) - checked both 
    $("#cottage").val(c_id); 
});

我有德在模態命名的小屋中輸入一個文本，我想在這個輸入中顯示這個id。

來源

2017-04-20 Khan

我有變化不大，當點擊按鈕顯示&我設置數據id的值彈出= 2

按鈕

<a class="btn btn-warning btn-minier" id="btnModalPopup" href="" role="button" data-toggle="modal" data-target="" data-id="2"><i class="icon-edit bigger-120"></i> Reservation </a>

我在你的模式下添加按鈕

<div id="myModal" class="modal fade" 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">Reservation Details</h4><br> 
        <h5>Cottage Id :</h5> 
        <h5>Cottage Title :</h5> 

       </div> 
       <div class="modal-body"> 
        <p> 
         ID WILL SHOW IN THIS TEXT FIELD. 
         <input type="text" name="cottage" placeholder="cottage id" value="" id="cottage" readonly /> 
        </p> 
       </div> 
       <div class="modal-footer"> 
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
        <button type="button" class="btn btn-success" data-dismiss="modal" id="btnSubmit">Submit</button> 

       </div> 
      </div> 
     </div> 
    </div>

Javascript代碼

<script> 
     $(document).ready(function() { 
      $('#btnModalPopup').click(function() { 

       var c_id = $(this).data('id'); 
       console.log(c_id) 

       $('#myModal #cottage').val(c_id) 
       $('#myModal').modal('show') 

      }); 

    $('#btnSubmit').click(function() { 

     alert('submit button click') 

     // get the id , from input field. 

     var id = document.getElementById('cottage').value; 
     console.log(id) 
     alert(id) 

     //You can set the id - to php variable - then hit to sever by ajax 
    }) 
     }); 


    </script>

來源

2017-04-20 12:20:02

當我得到這個身份證有模態，那麼我將如何使用作爲一個PHP變量，因爲我想運行這個ID的mysql查詢 – Khan

那麼你可以使用data-id =「<？php echo $ cottage_id？>」，設置將data-id屬性賦值爲錨點標記...並以jquery方式通過id獲取值。 –

您可以通過點擊提交/更新按鈕上的ID獲取值。 document.getElementById（「myText」）。value;然後添加到PHP變量 –

嘗試使用JQuery

的ATTR方法

$('#modal-form-show').on('show.bs.modal', function(e) { 
    // instead of this 
    //var c_id= $('a[href="#modal-form-show"]').data('id'); 
    // try this one 
    var c_id= $('a[href="#modal-form-show"]').attr('data-id'); 
    //var c_id= $(this).data(id) - checked both 
    $("#cottage").val(c_id); 
});

來源

2017-04-20 11:09:34 redfades

無法運作。 – Khan

試試這個片斷：

$('.btn-minier').click(function(){ 
    var c_id = $(this).attr('data-id'); 
    $('#cottage').val(c_id); 
});

來源

2017-04-20 12:46:04

將數據ID傳遞到引導模式的問題

回答

相關問題