Question

我有一个包含多个编辑按钮的表格。每个编辑按钮都应该打开一个模态，我试图将delivery_id传递给它，所以我可以在MySQL查询中使用它

echo "<td><button type='button' class='btn dt_buttons' data-toggle='modal' data-id='$delivery_id' data-target='#editModal'>Edit</button></td>";

在模态中检索该值并将其用作变量的最佳方法是什么？我认为只使用$ delivery_id会起作用，但当然这太简单了！

模态内的代码：

<div id="editModal" class="modal fade" role="dialog">
  <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">Edit Purchase</h4>
      </div>
      <div class="modal-body">
      <?
        $query      =   "SELECT id, supplier_id, date as del_date, delivery_number, po_number, cost_value FROM store_purchases WHERE id = $delivery_id";
                echo $query;
        $retval     =   f_select_query($query, $datarows);

        $lint_product_id                =    f_htmlspecialchars_decode($datarows[0]->id , ENT_QUOTES);


        $supplier_id            =    intval($datarows[0]->supplier_id);

        $delivery_date          =   $datarows[0]->del_date;

        $delivery_number            =    intval($datarows[0]->delivery_number);

        $lint_unit_cost                 =    f_htmlspecialchars_decode($datarows[0]->cost_value , ENT_QUOTES);
        $lint_unit_cost                 =    floatval($lint_unit_cost);
        $lint_unit_cost                 =    number_format($lint_unit_cost, 2);



$department_id_dropdown     =   f_get_dropdown("supplier_name", "supplier_name", "supplier_master", $supplier_id, "id", " store_id = $store_id", '', '', '', false, false, true);
?>
      <div class="container-fluid" id="div_user_master" class="ae_form" >
        <form id="myForm" action="/platformDev/create_subscription.php" method="POST">
        <?
        echo "Supplier Name: <td class='text-right' id='department_id' style='width:20%;'> $department_id_dropdown </td> <input id='purch_id' name='purch_id' class='form-control purch_id' value='$product_id' type='hidden'/>";
        echo "Delivery Date: <span class='required_field'><i class='fa fa-star fa-sm'></i>   </span> <input class='form-control' tabindex='3' id='date' name='date' value= '$delivery_date' type='text'/>   <br/>";
        echo "Delivery Number: <input type='text' id='unit_cost' name='unit_cost' class='form-control unit_cost' style='width:80%;' value='$delivery_number' />";
        echo "Invoice Cost: <input type='text' id='unit_cost' name='unit_cost' class='form-control unit_cost' style='width:80%;' value='$lint_unit_cost' /></div>";
?>



        </form>
    </div>
      </div>
      <div class="modal-footer">
        <button class="btn form-btns btn-primary"  style="float: left;" data-dismiss="modal" id="customButton">Add Purchase</button>
        <button type="button" class="btn  dt_buttons close_this ajax_forms" data-dismiss="modal">Close</button>
      </div>
    </div>

  </div>

Answer 1

以下代码将从点击的按钮中获取data-id值。

您可以使用此模板：

$('#editModal').on('show.bs.modal', function (event) {
  var button = $(event.relatedTarget);
  var delivery_id = button.data('id'); // delivery id here


  var modal = $(this)
  modal.find('.modal-title').text('Delivery #' + delivery_id);
  modal.find('.modal-body').html('content here');
});

https://getbootstrap.com/docs/4.0/components/modal/ https://getbootstrap.com/docs/3.3/javascript/#modals

Answer 2

我想您正在尝试使用id来获取记录并使用该数据填充模态。

如果是这样的话：

您可以使用Javascript检索data-id属性值，并向您的php脚本发送Ajax请求并查询您的数据库。

$('.dt_buttons').on('click', function()
{
    var id = $(this).attr('data-id');
    $.ajax
    ({
        url: "your/url",
        data: 
        {
            id : id
        },
        method: 'POST'
    }).success(function(response) 
    {
        var json = response,
        obj = JSON && JSON.parse(json) || $.parseJSON(json);

        // say you have following fields.

        var fid = obj[0].id;
        var title = obj[0].title;

        //retrieve record fields here.

        // or just pass the `id` skipping the Ajax stuff above. 

        $('#editModal')
            .find('span.doc-title').text(title).end()
            .find('[name="id"]').val(id).end();

        /* show modal.. */
        $('#editModal').modal('show');
    });  
});

将PHP变量传递给模态并在MySQL查询中使用它

2 个答案: