Question

我在show事件上附加了一个关于我的boostrap模式的jQuery事件。我的页面上还有几个“编辑”按钮。我想知道哪个按钮称为show事件，我试图通过在'e'上获得'目标'来实现这一目标

但是它会在调用模态节目的按钮上返回模态。

$('#modAddProduct').on('show.bs.modal', function(e) {
    console.log(e.target);
});

在将事件附加到我的更新（“编辑”）按钮后调用模态显示，如下所示

$("#tblProducts tbody").on("click", "#btnUpdateProduct", function () {

    var element = $(this).closest("tr");
    var id = element.attr("id");
    var productName = element.find("#tdDescription").text();
    var costPrice = element.find("#tdCostPrice").text();
    var salePrice = element.find("#tdSalePrice").text();
    var quantity = element.find("#tdQuantity").text();

    $(".modal-body #txtProductName").val(productName);
    $(".modal-body #txtProductCostPrice").val(costPrice.substring(1));
    $(".modal-body #txtProductSalePrice").val(salePrice.substring(1));
    $(".modal-body #txtProductQuantity").val(quantity);
    $(".modal-body #ddProductCategories").prop("disable", true);
    $(".modal-body #ddProductBrand").prop("disable", true);

    $("#modAddProduct").modal("toggle");
});

这样做的目的是将ID从编辑按钮行传递给模态，这样我就可以通过ajax调用将其返回给服务器

Answer 1

you can use the function on the edit buttons and pass the id to that function like .. Hope it helps !

<button onclick="open_modal(your_unique_id_here)">Edit</button>
<script>
function open_modal(your_unique_id_here){
    console.log(your_unique_id_here);
    $("#abc").modal("show");
}
</script>

Answer 2

试试这个：

$('#modAddProduct').on('show.bs.modal', function(e) {
    console.log($(e.relatedTarget).data(‘id’);
});

对于每个编辑按钮，传递参数：

$("#btnUpdateProduct").on('click',{btnId:'btnId1'},function(obj){
  console(obj.data.btnId);
    $("#modAddProduct").modal("show");
});

我如何获得在jQuery中调用模态显示的value元素

2 个答案: