【问题标题】:passing value from php to modal将值从 php 传递到 modal
【发布时间】:2017-12-06 04:10:36
【问题描述】:

我正在尝试学习将值从 php 传递给 modal,但它似乎不起作用,控制台中没有错误。

这是我在 while 循环中的 php

echo'
  <tbody>
    <tr>
      <td>'.$row->equipID.'</td>
      <td>'.$row->equipType.'</td>
      <td>
        <a href="#editModal" class="btn btn-info btn-xs" data-id="'.$row->equipID.'" data-toggle="modal">
        <i class="fa fa-pencil"></i> Edit </a>
      </td>
    </tr>
  </tbody>';

这是我想从 php 传递值的 html 文件

<div class="modal fade" id="editModal" role="dialog">
  <div class="modal-dialog">
    <div class="modal-content">
      <h3 class="modal-title">Edit Truck Category</h3>
      <div class="modal-body">
        <form>
          <div class = "fetched-data"></div>
          <input type="text" id="truck" placeholder="Truck Category *"  required>
        </form>
      </div>
    </div>
  </div>
</div>

这是我的 js

<script>
  $(document).ready(function(){
    $('#editModal').on('show.bs.modal', function (e) {
        var rowid = $(e.relatedTarget).data('id');
        $.ajax({
            type : 'post',
            url : 'fetch_record.php', //Here you will fetch records
            data :  'rowid='+ rowid, //Pass $id
            success : function(data){
            $('.fetched-data').html(data);//Show fetched data from database
            }
        });
     });
  });
</script>

非常感谢您。

【问题讨论】:

  • 您是在日志文件中还是直接在浏览器中打印php输出(不使用ajax)并验证您是否从php中获取了有效的html输出代码?
  • console.log(data) 里面成功了,看看是不是你期望的。
  • 没有价值。我也试图把警报('成功');内部成功,但它没有弹出,所以我无法验证从 php 传递的数据是否正确
  • @NoobProgramer 先检查你的 fetch_record.php 是否返回数据
  • 是的,我尝试输入一个虚拟数据并且它可以工作

标签: javascript php jquery


【解决方案1】:

我忘了包括

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

【讨论】:

    【解决方案2】:

    您可以使用 load 函数来实现上述功能。我将通过一个例子来描述它。请注意,我只包含了需要解释的代码段。

    1.我从PHP文件中返回一个表(假设:文件名-data.php)。

    $table = "<table class='table table-bordered'>";
    // Table data
    $table.="</table>";
    echo $table;
    

    2.显示数据的模式。

    <div id="mymodal" class="modal fade">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                </div>
                <div class="modal-body mymodal-body">
                </div>
                <div class="modal-footer">
                </div>
            </div>
        </div>
    </div>
    

    3.加载数据到模态体

    $('.mymodal-body').load('/data.php', function (result) {
            $('#mymodal').modal({show: true});
    

    我希望以上代码示例能帮助您了解您的问题。您可以尝试使用加载功能。

    【讨论】:

      猜你喜欢
      • 2017-10-19
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2020-11-02
      • 2016-03-27
      相关资源
      最近更新 更多