从模态页面中获取价值答案

【问题标题】：Get value from page in modal从模态页面中获取价值
【发布时间】：2016-06-09 10:38:17
【问题描述】：

我有带有名称的表格，当我单击名称时，我需要打开模式并将我单击的名称放在那里。我该怎么做？提前致谢

report.php

按钮：

<a href='#ReportModal' data-id='1' data-toggle='modal'>Open</a></td>

模态：

<div id="ReportModal" class="modal" role="dialog" data-backdrop="static" data-keyboard="false">
  <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">asd</h4>
      </div>
      <div class="modal-body">
        //HOW TO PRINT HERE?
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>

  </div>
</div>

脚本

<script>
$(document).ready(function() {
    $(document).on("click",".get-data"function(){
       var val = $(this).attr("data-id");    
       $.ajax({
            url: "../dist/scripts/report.userinfo.php",
            type: "POST",
            dataType: "HTML",
            async: false,
            success: function(data) {
               $('.modal-body').html(data);          
           }
         }); 

     });
});
</script>

report.userinfo.php

<?php
         include($_SERVER['DOCUMENT_ROOT']."/dist/config.php");
         $id = $_POST['id'];
         $query =  $db->query ("select Name from _reports where ID = '$id' ") or die($db->error());
         $rows= $query->fetch_array();
         echo $rows['Name'];
    ?>

【问题讨论】：

请与我们分享您的 JS 代码，以便我们了解您的尝试以及我们如何为您提供帮助。
@Hr- 你不能那样做。 PHP 是服务器端的，因此当您单击页面本身时就完成了。
@DocRattie 我添加了脚本，请帮忙）
@mpf82 我添加了脚本，请帮忙）

标签： javascript php jquery twitter-bootstrap

【解决方案1】：

您快到了，现在您只需执行分配给类 get-data 的元素的代码 - 要实现此目的，您可以将类添加到锚点。

$(document).ready(function() {

  $("#ReportModal").dialog();

  $(document).on("click", ".get-data", function() {

    var val = $(this).attr("data-id");

    // for the sake of testing we assume your AJAX call works
    // and then you can remove the following line and handle it
    // in the success handler as shown in the comment below
    $('.modal-body').html("You clicked: " + val);

    /*
    $.ajax({
      url: "../dist/scripts/report.userinfo.php",
      type: "POST",
      dataType: "HTML",
      async: false,
      success: function(data) {
        $('.modal-body').html(data);
      }
    });*/

  });
});

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

<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>

<a href='#ReportModal' data-id='1' data-toggle='modal' class="get-data">Open</a>

<div id="ReportModal" class="modal" role="dialog" data-backdrop="static" data-keyboard="false">
  <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">asd</h4>
      </div>
      <div class="modal-body">
        //HOW TO PRINT HERE?
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>

  </div>
</div>

【讨论】：