Javascript 向引导模式传递数据id时出现问题

我有一个清单页面，其中包含一个链接按钮，用于显示PHP循环中的模式重复。我已经搜索并找到了这些： ，和其他一些，但失败了

我想要什么

我已经从数据库中获取了数据id，并将其传递给bootstrap modal，在那里我将使用该id通过MySQL查询显示更多信息

我已经写了所有的代码，但是ID没有传递给modal

模式链接按钮代码

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

$('#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。

尝试使用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);
});

---

尝试使用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);
});

---

当点击按钮显示弹出窗口时，我几乎没有变化&我已经设置了数据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>

&时代；
预订详情

小屋Id:
村舍名称：

ID将显示在此文本字段中。

接近
提交

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>

$（文档）.ready（函数（）{
$（'#btnModalPopup'）。单击（函数（）{
var c_id=$（this）.data（'id'）；
console.log（c_id）
$（“#myModal#小屋”）.val（c#u id）
$（'#myModal'）.modal（'show'））
});
$（'#btnsupmit'）。单击（函数（）{
警报（'提交按钮单击'）
//从输入字段获取id。
var id=document.getElementById（'小屋'）。值；
控制台日志（id）
警报（id）
//您可以将id设置为php变量，然后通过ajax将hit设置为sever
})
});

当单击按钮显示弹出窗口时，我几乎没有什么变化&我已将数据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>

&时代；
预订详情

小屋Id:
村舍名称：

ID将显示在此文本字段中。

接近
提交

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>

$（文档）.ready（函数（）{
$（'#btnModalPopup'）。单击（函数（）{
var c_id=$（this）.data（'id'）；
console.log（c_id）
$（“#myModal#小屋”）.val（c#u id）
$（'#myModal'）.modal（'show'））
});
$（'#btnsupmit'）。单击（函数（）{
警报（'提交按钮单击'）
//从输入字段获取id。
var id=document.getElementById（'小屋'）。值；
控制台日志（id）
警报（id）
//您可以将id设置为php变量，然后通过ajax将hit设置为sever
})
});

试试这个片段：

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

请尝试以下代码段：

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

---

当我在模式中得到这个id时，我将如何使用它作为php变量，因为我想在这个id上运行mysql查询。您可以使用data id=“”，将value to data id属性设置为anchor tag…并以jquery的方式按id获取值。您可以在单击提交/更新按钮时按id获取值。document.getElementById（“myText”）.value；然后添加到php变量你能给我一个例子吗？thanx作为帮助当我在模态中得到这个id时，我将如何作为php变量使用，因为我想在这个id上运行mysql查询。你可以使用数据id=“”，将value to data id属性设置为anchor tag…并以jquery方式按id获取值。您可以在单击提交/更新按钮时按id获取值。document.getElementById（“myText”）.value；然后添加到php变量你能给我一个例子吗？thanx对于帮助我使用了和你一样的类名，但不起作用，然后我在标记中给出了一个id，并在这个函数中使用了这个id（#id），这个id起作用了。我使用了和你一样的类名，但不起作用，然后我在标记中给出了一个id，并在这个函数中使用这个id（#id）这很管用。这是一篇老文章，但它在寻找答案。对这个问题的最好答案是。要获取数据id，请使用e.relatedTargetOld post，但在搜索答案时发现它。对这个问题的最好答案是。要获取数据id，请使用e.relatedTarget