Question

我正在使用bootstrap模式，目前我仍然坚持将值显示为模态。

这是用户点击视图时的html

<a data-toggle="modal" data-id="<?php echo $row33['bicycle_id']; ?>" href="#myModal" class="Buto" >view</a>

然后我使用jquery-ajax传递data-id的值来执行php中的查询

 $(document).on("click",".Buto", function () {
 var dataID = $(this).data('id'); 

$.ajax({
    url: 'getId.php?id=' + dataID,
    type:'GET',
    dataType: 'json',
    context: this,
    success: function(values)
            {
                values = $.parseJSON(values);                   
                $('.table-responsive #pname').html(values.name);
                $('.table-responsive #pprice').html(values.price);
                $('.table-responsive #pdescription').html(values.description);
            } 
});

}）;

这是getId.php文件

<?php
    include 'includes/connection.php';
    $modalDataId = $_GET['id'];
    $resu = mysqli_query($conn,"SELECT * FROM bicycle WHERE bicycle_id = $modalDataId");
   while ($row7 = mysqli_fetch_assoc($resu)){
      $values['name'] = $row7['name'];
      $values['price'] = $row7['price'];
      $values['description'] = $row7['description'];
}
echo json_encode($values);
?>

然后是应该显示值的模态

<div class="modal-body">
        <div class="table-responsive" id = "div1" style = " width: 100%; margin-right: 10%;  background-color: white;">
            <table id = "" align = "center" class="table table-hover table-striped demo2" style = "table-layout:fixed;">    <thead style = "">
                    <tr style = "background-color: #428bca; color: white;">
                        <th class="col-sm-3">BIKE NAME</th>
                        <th class="col-sm-3" >SRP</th>
                        <th class="col-sm-3" >DETAILS</th>

                    </tr>
                </thead>
                <tbody id="myTable">
                    <tr style = "text-align: center;"  data-toggle="modal" data-id="" data-target="#orderModal">            
                        <td id="pname"></td>
                        <td id="pprice"></td>
                        <td id="pdescription"></td>                     
                    </tr>
                </tbody>                
            </table>
        </div>
    </div>

Answer 1

确定。让我为你解决问题：

你应该问的第一个问题是：我的ajax-success-callback函数是否被调用？如何验证代码是否已执行？简单：创建一些输出来调试代码。对于记录简单变量，警报（...）应该没问题。如果要调试阵列的内容，如果将其记录到控制台，则会更好。

所以我会尝试的是：

$.ajax({
    url: 'getId.php?id=' + dataID,
    type:'GET',
    dataType: 'json',
    context: this,
    success: function(values)
            {
                // not sure about alerts in ajax callbacks but you can try it:
                alert('inside success callback');
                values = $.parseJSON(values);
                // alert a value:
                alert('values.name is: '+values.name);               
                $('.table-responsive #pname').html(values.name);
                $('.table-responsive #pprice').html(values.price);
                $('.table-responsive #pdescription').html(values.description);
                // log all values to the javascript console in your browser
                console.log(values);
            } 
});

尝试并查看输出。

一个。您没有看到任何警报窗口。这意味着您的成功回调函数永远不会执行，或者您有一个javascript错误。查看浏览器中的javascript控制台，查看console.log（values）是否创建了输出。有关console.log（...）的更多信息，请访问：What is console.log and how do I use it?

湾你可以看到警报窗口。但第二个警报类似于：'values.name is undefined'。 - ＆GT;你的php没有按预期工作。

如果无法实际调试代码，我就会改进它：

<?php
    include 'includes/connection.php';
    $modalDataId = $_GET['id'];
    $resu = mysqli_query($conn,"SELECT * FROM bicycle WHERE bicycle_id = $modalDataId");

    // You expect one row to be returned then you need no while loop:
    $row7 = mysqli_fetch_assoc($resu);

    // Initialize values array
    $values = array();

    if ($row7) {
       $values['name'] = $row7['name'];
       $values['price'] = $row7['price'];
       $values['description'] = $row7['description'];
    }

    echo json_encode($values);
?>

试试并回复你的结果。

Answer 2

这是得益于walfish3d的答案。我修改了他提供的代码。

jquery-ajax：

$(".Buto").on("click",function () {
         var dataID = $(this).data('id'); 

                $.ajax({
                    url: 'getId.php?id=' + dataID,
                    type:'GET',
                    dataType: 'json',
                    context: this,
                    success: function(values)
                    {                                                                    
                        $('.table-responsive #pname').html(values.name);
                        $('.table-responsive #pprice').html(values.price);
                        $('.table-responsive #pdescription').html(values.description);
                        // log all values to the javascript console in your browser
                        console.log(values);
                    } 
                });
     });

getId.php文件：

<?php
include 'includes/connection.php';
$modalDataId = $_GET['id'];
$resu = mysqli_query($conn,"SELECT * FROM bicycle WHERE bicycle_id = $modalDataId");

// You expect one row to be returned then you need no while loop:
$row7 = mysqli_fetch_assoc($resu);

// Initialize values array
$values = array();

if ($row7) {
   $values['name'] = $row7['name'];
   $values['price'] = $row7['price'];
   $values['description'] = $row7['description'];

}

echo json_encode($values);

＆GT;

如何从jquery-ajax向modal显示值？

2 个答案: