Question

我真的坚持以下几点。我有这个动态生成的表，显示一些带有一些数据的购物清单产品名称和产品价格来自API。

当我点击购物按钮时，我想要一个模式显示一个总结购买的文本，然后点击确认按钮将数据保存到数据库中。

在这种情况下，我将动态变量存储在元素id或值或两者中。但是，如果我想 - 现在我想 - 存储两个以上的变量怎么办？

所以，这是我的代码：

  <table class="sortable" id="myTable">

              <thead >
                <tr>
                    <th onclick="sortTable(0)">Product</th>
                    <th onclick="sortTable(1)">Price</th>
                    <th onclick="sortTable(1)">Amount</th>
                    <th onclick="sortTable(3)"></th>
                </tr>
            </thead>
                <tbody>

                            <?php

                            foreach ($result as $doc) {

                              $price = $doc['2. price'];
                              $name = $doc['1. symbol'];
                              $rd_price = round($price, 2);
                              ?>

                              <tr>
                                  <td><?php echo $name; ?></td>
                                  <td class="product_price"><?php echo $rd_price; ?></td>
                                  <td><input type="text" id= "product_qty_" name="qty" class="product_qty" value="0"></td>
                                  <td class="amount_sub_total">0</td>
                                  <td><button class="sbtn" data-id="sbtn" data-name="<?php echo $name; ?>" data-price="<?php echo $rd_price; ?>" data-toggle = "modal" data-target = "#myModal" onclick="showDetails(this)">
                                     <i class="fas fa-shopping-cart"></i>
                                  </button></td>
                              </tr>

                        <?php } ?>

            </tbody>
        </table>
    </div>
</div>

<!-- Modal -->
<div class = "modal fade" id = "myModal" tabindex = "-1" role = "dialog"
   aria-labelledby = "myModalLabel" aria-hidden = "true" data-backdrop="false" style="">

   <div class = "modal-dialog">
      <div class = "modal-content">

         <div class = "modal-header">
           <h4 class = "modal-title" id = "myModalLabel">
              Purchase order
           </h4>


            <button type = "button" class = "close" data-dismiss = "modal" aria-hidden = "true" style="background-color: transparent; margin-top: -20px; float: right; color: #4d4646; width: 10px; height: 10px;">
                  &times;
            </button>


         </div>

         <div class = "modal-body">
            <p><span id="value"></span></p>
         </div>
         <div class = "modal-footer">
                     <button type = "button" id="modal_yes_btn" class = "btn btn-primary" style="width: 80px; height: 40px;" onclick="yesBtnFunction()">
                        Yes
                     </button>

                     <button type = "button" class = "btn btn-default" data-dismiss = "modal" id="modal_no_btn" style="width: 80px; height: 40px;" onclick="noBtnFunction()">
                        No
                     </button>

                  </div>

               </div><!-- /.modal-content -->
            </div><!-- /.modal-dialog -->

</div><!-- /.modal -->

<script>

var product_quantity;
var sub_total;
$( document ).ready(function() {

    $(document).on("input paste keyup", ".product_qty", function( event ) {


        var product_price = 0;
        var gst_amount = 0;

        var sub_total = 0;
        var total_qty = 0;
        var grand_total = 0;


        product_quantity = $(this).val();
        product_price = $(this).parent().prev().html();

        sub_total = product_price * product_quantity;

        var sbt_display = $(this).parent().next().html(sub_total);
        $(this).parent().next().html(sub_total)

  });
});

function showDetails(button) {
var name = $(this).attr("data-name");
var price = $(this).attr("data-price");
var selectedAmount = product_quantity;

    $.ajax({
    url: "customer.php",
    method: "GET",
    data: {"name": name, "price": price, "selectedAmount": selectedAmount},
    success: function(response){
      $("#value").text(response);
    }
});

}

 </script>

customer.php

<?php
$name = $_GET["name"];
$price = $_GET["price"];
$selectedAmount = $_GET["selectedAmount"];
$totalprice = $price * $selectedAmount;

echo "You are about to purchase " . $selectedAmount . " shares of " . $name . " at $ " . $price . " per unit. " . "Total price: $ " . $totalprice .  " Do you want to proceed?";

 ?>

但是，如果我需要存储两个以上的值，或者我只想留下一个非变量Id，我怎么能这样做呢？

非常感谢提前。

Answer 1

您可以将它们作为attr添加到元素中像那样

<button data-id="id" data-amount="amount" data-price="price"> send</button>

JS

function showDetails(button) {
var customerNumber = $(this).attr("data-id");
var customerPrice = $(this).attr("data-price");
var selectedAmount = $(this).attr("data-amount");

    $.ajax({
    url: "customer.php",
    method: "GET",
    data: {"customerNumber": customerNumber, "customerPrice": customerPrice, "selectedAmount": selectedAmount},
    success: function(response){
      $("#value").text(response);
    }
});

并且不要忘记传递给函数$(this)而不是this

通过AJAX传递几个PHP动态变量

1 个答案: