Javascript PHP根据用户选择的项目在模式中加载数据

如何加载PHP引导模式对话框中的数据？ 在这种情况下，产品将动态加载到页面上。用户可以单击任何项目，根据用户单击的项目，引导模式应加载该单击项目的数据

PHP代码：

$products = Product::byCategory($category->id);
while ($product = $products->fetch(PDO::FETCH_OBJ)) {
    echo '<div class="row">';
    echo '<div class="col-md-7"><b>' . $product->name . '</b>'; 
        if($product->is_vegi == YES){echo ' <img src="//dy3erx8o0a6nh.cloudfront.net/images/diet_veg_17px.png" alt="Vegetarian" class="iconVegetarian">';}
    echo "<br />" . $product->description . "</div>";
    echo '<div class="col-md-5">';
    echo '<div class="row">';
    echo '<div class="col-md-offset-3 col-md-4">&pound;' . $product->price . '</div>';
    echo '<div class="col-md-3"><input type="text" maxlength="2" name="qty" id="qty' . $product->id . '" class="form-control custom-control input-sm" value="1" readonly /></div>';
    echo '<div class="col-md-2"><button type="button" id="' . $product->id . '" class="showModalForPizza btn btn-info btn-xs" data-toggle="modal" data-target="#pizzaDetails"><i class="fa fa-wrench"></i> Change</button></div>';
    echo "</div></div></div><br />";
}

---

目标数据是存储在模式中的具有匹配ID的数据。加载此数据的最佳方式是什么？

我以前多次这样做过。。。我所做的是：

1） 在我的项目中有一个名为

ajax

的文件夹

2） 在它里面我放了一个名为

ajax\u get\u product\u info.php

的文件，它将返回一个HTML响应，其中包含结构良好的产品信息

//NOTE: CHANGE METHOD NAMES FOR THE EQUIVALENTS ON YOUR FRAMEWORK/CLASS
$productInfo = Product::byId($_GET["id"]); 
?>
<div class="row">
    <div class="col-sm-6">
         <h1><?php echo $productInfo->Title; ?></h1>
         <b>Price: $</b><?php echo $productInfo->Price; ?>
         <hr/>
         <p><?php echo $productInfo->Description; ?></p> 
    </div>
    <div class="col-sm-6">
         <img src="<?php echo $productInfo->ImageURL; ?>" class="dialog-image"/>    
    </div>
</div>

//注意：更改框架/类上等价物的方法名称
$productInfo=Product:：byId（$\u GET[“id”]）；
?>
价格：$


ImageURL；？>“class=”对话框图像“/>

3） 使用jQuery（因为使用的是Bootstrap，所以已经包含了jQuery）并使用它的一个AJAX方法在model中加载返回的

您可以使用函数

$（“#modalContent”）.html（theaaxresponse）

实现这一点

有关jQuery ajax和示例的更多信息，请参见：

当您单击该按钮时，它将触发AJAX函数到url

“/AJAX/AJAX\u get\u product\u info.php？id=“+$（this）.id（）

---

如果您阅读jQuery文档中的示例，您可能会很容易理解，否则，请过来询问！

我以前做过很多次……我所做的是：

1） 在我的项目中有一个名为

ajax

的文件夹

2） 在它里面我放了一个名为

ajax\u get\u product\u info.php

的文件，它将返回一个HTML响应，其中包含结构良好的产品信息

//NOTE: CHANGE METHOD NAMES FOR THE EQUIVALENTS ON YOUR FRAMEWORK/CLASS
$productInfo = Product::byId($_GET["id"]); 
?>
<div class="row">
    <div class="col-sm-6">
         <h1><?php echo $productInfo->Title; ?></h1>
         <b>Price: $</b><?php echo $productInfo->Price; ?>
         <hr/>
         <p><?php echo $productInfo->Description; ?></p> 
    </div>
    <div class="col-sm-6">
         <img src="<?php echo $productInfo->ImageURL; ?>" class="dialog-image"/>    
    </div>
</div>

//注意：更改框架/类上等价物的方法名称
$productInfo=Product:：byId（$\u GET[“id”]）；
?>
价格：$


ImageURL；？>“class=”对话框图像“/>

3） 使用jQuery（因为使用的是Bootstrap，所以已经包含了jQuery）并使用它的一个AJAX方法在model中加载返回的

您可以使用函数

$（“#modalContent”）.html（theaaxresponse）

实现这一点

有关jQuery ajax和示例的更多信息，请参见：

当您单击该按钮时，它将触发AJAX函数到url

“/AJAX/AJAX\u get\u product\u info.php？id=“+$（this）.id（）

---

如果您阅读jQuery文档中的示例，您可能会很容易理解，否则，请过来询问

您只需要通过Javascript调用

这是密码

$('.showModalForPizza').on('click', function() {
    var id = $(this).attr('id');
    $.ajax({
        url: 'PHPFilename',
        type: 'get',
        data: {id: id},
        success: function(data){
            console.log(data);
            $('#pizzaDetails').html(data);
            $('#pizzaDetails').modal('show');
        }
        error: function(){
            console.log("error");
        }
    });
});

---

您只需要通过Javascript调用

这是密码

$('.showModalForPizza').on('click', function() {
    var id = $(this).attr('id');
    $.ajax({
        url: 'PHPFilename',
        type: 'get',
        data: {id: id},
        success: function(data){
            console.log(data);
            $('#pizzaDetails').html(data);
            $('#pizzaDetails').modal('show');
        }
        error: function(){
            console.log("error");
        }
    });
});

---

这里已经有AJAX了吗？是的@JuanBonnett，谢谢你的回复。。。让我试试，这里已经涉及到AJAX了吗？是的@JuanBonnett，谢谢你的回复。。。让我试试看谢谢@JuanBonnett我接受了你的回答这是一个很大的帮助…：）谢谢@JuanBonnett我接受了你的回答，这是一个很大的帮助…：）