Взаимодействие с данными Datatables Отключает другие Javascript Функции

Question

У меня есть элемент, который открывает модал:

<a style="color:#5cb85c" data-toggle="modal" data-target="#CallModal" data-id="@item.Supplier.Id" href="#CallModal"  class="fas fa-phone-square"></a>

У меня есть Javascript прослушиватель data-toggle = модальный, который передает идентификатор данных в поле id = "CallSupplier" в модал.

    $(document).ready(function () {
        $('a[data-toggle=modal], button[data-toggle=modal]').click(function () {
            var data_id = '';
            if (typeof $(this).data('id') !== 'undefined') {
                data_id = $(this).data('id');
            }
            $('#CallSupplier').val(data_id);
        })
    });

Все это прекрасно работает. но у меня также есть Datatables. Все прекрасно работает, пока я не взаимодействую с Datatables через поиск или нумерацию страниц, а затем javascript для заполнения модального режима перестает работать / запускать.

Вот полный элемент скрипта на моей странице. Я думаю, это как-то связано с тем, как я определяю мои JS функции:

<script type="text/javascript">
    $(document).ready(function () {
        $('#SupplierTable').dataTable({
            searching: true,
            lengthChange: false,
            info: false,
            pagingType: "first_last_numbers",
            order: [2, 'desc'],
            pageLength: 5,
            dom: 'Bfrtip',
            buttons: ['copy', 'csv', 'excel', 'pdf', 'print'],
            "columnDefs": [{ "type": "date", "targets": 2 }]
        });
    });
    //map the data-id fields to the objects
    $(document).ready(function () {
        $('a[data-toggle=modal], button[data-toggle=modal]').click(function () {
            var data_id = '';
            if (typeof $(this).data('id') !== 'undefined') {
                data_id = $(this).data('id');
            }
            $('#AttachmentSupplier').val(data_id);
            $('#CallSupplier').val(data_id);
            $('#CommentSupplier').val(data_id);
        })
    });
</script>

Answer 1

Я нашел очень похожий пост, который побудил меня ответить на этот вопрос. Функция перестает работать после сортировки таблицы

Я удалил $ (document) .ready () из своей функции, и теперь она продолжает работать даже после сортировки или разбивки на страницы в Datatables.

    $('a[data-toggle=modal], button[data-toggle=modal]').click(function () {
        var data_id = '';
        if (typeof $(this).data('id') !== 'undefined') {
            data_id = $(this).data('id');
        }
        $('#AttachmentSupplier').val(data_id);
        $('#CallSupplier').val(data_id);
        $('#CommentSupplier').val(data_id);
    })