Question

我正在使用数据表，在一列中我有一个用于删除的按钮。单击此按钮需要显示一个模态，然后显示“是/否”以删除该行。

我设法让模态工作，但我无法获取javascript来获取我的id。它不会注册click事件。

这是我的代码（我省略了代码的明显部分，例如表格）：

echo "<td>";
                    $deletetitle = lang('general_delete');
                    echo "<button class=\"btn btn-secondary rowBtnDelete\" data-toggle=\"modal\" data-target=\"#deletemodal\" data-vacid=\"$vac->vacancy_id\" data-userid=\"$this->auth_user_id\">$deletetitle</button>";
                    echo "</td>";

模态代码：

<!-- Modal dialog for the deletion confirmation -->
<?php
$delAction = 'dashboard/deleteVacancy';
?>
<div id="deletemodal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="title-delete" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <form class="modal-content" action="<?=site_url( $delAction, $link_protocol )?>" method="post" data-class="validation">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span class="fa fa-times" aria-hidden="true"></span>
                </button>
                <h4 class="modal-title" id="title-duplicate">verwijderen?</h4>
            </div>
            <div class="modal-body">

            </div>
            <div class="modal-footer">
                <?php echo form_submit('deletebtn', lang("general_yes"), "class='btn btn-secondary'");  ?>
                <a id="delcancelmodal" class="btn btn-secondary" data-dismiss="modal"><?=lang("general_no")?></a>
            </div>
        </form>
    </div>
</div>

现在，当我在javascript中执行以下操作时，没有任何反应（我希望弹出警报？）：

$(document).ready(function () {
    $('button.rowBtnDelete').on('click', function (e) {
        e.preventDefault();
        //var id = $(this).closest('tr').data('id');
        //$('#deletemodal').data('id', id).modal('show');
        alert("pls");
    });
});

编辑：数据表配置代码如下所示： // DataTables＆＃34;我的职位空缺＆＃34;组织页面

var table = $('#table_id').DataTable({
    "language": {
        "decimal":        "",
        "emptyTable":     "Geen data gevonden in tabel",
        "info":           "Toon _START_ tot _END_ van de _TOTAL_ activiteiten",
        "infoEmpty":      "Toon 0 tot 0 van de 0 activiteiten",
        "infoFiltered":   "(gefilterd van _MAX_ totale activiteiten)",
        "infoPostFix":    "",
        "thousands":      ",",
        "lengthMenu":     "Toon _MENU_ activiteiten",
        "loadingRecords": "Loading...",
        "processing":     "Processing...",
        "search":         "Zoeken:",
        "zeroRecords":    "Geen resultaten gevonden voor je zoekopdracht",
        "paginate": {
            "first":      "Eerste",
            "last":       "Laatste",
            "next":       "Volgende",
            "previous":   "Vorige"
        },
        "aria": {
            "sortAscending":  ": klik om de kolom oplopend te sorteren",
            "sortDescending": ": klik om de kolom aflopend te sorteren"
        }
    },
    "order": [[ 1, "desc" ]],
    dom: 'Bfrtip',
    buttons: [
        {
            extend: 'copy',
            orientation: 'landscape',
            pageSize: 'LEGAL',
            exportOptions: {
                columns: [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 ]
            }
        },
        {
            extend: 'excel',
            orientation: 'landscape',
            pageSize: 'LEGAL',
            exportOptions: {
                columns: [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 ]
            }
        },
        {
            extend: 'pdfHtml5',
            orientation: 'landscape',
            pageSize: 'LEGAL',
            exportOptions: {
                columns: [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 ]
            }
        }
    ],
    "pagingType": "full_numbers",
    drawCallback: function() {
        $('button.rowBtnDelete').on('click', function (e) {
            //e.preventDefault();
            alert("pls");

            // Get data like so
            //$(this).data('vacid');
        });
    }
});

Answer 1

所以问题是你的删除模式不能获取你需要删除的记录的id。我的建议是在你的模态中包含一个隐藏的ID字段，当点击一行删除按钮时，用id更新隐藏字段。

<form class="modal-content" action="<?=site_url( $delAction, $link_protocol )?>" method="post" data-class="validation">
    <!-- Add below -->
    <input type="hidden" id="deleteModalVacId" name="vacid" value=""/>

点击事件（假设vacid在行按钮元素上）

$(document).ready(function () {
    $('button.rowBtnDelete').on('click', function (e) {
        e.preventDefault();
        var id = $(this).data('vacid');
        $('#deleteModalVacId').val(id);
        $('#deletemodal').modal('show');
    });
});

无法在数据表

1 个答案: