modal box is not showing in chrome mobile view. Error(Cannot read property '2' of undefined)

SamaraSsr

<script type="text/javascript">

        $(document).ready(function() {
    var table = $('#example').DataTable( {
        "ajax": "data/arrays.txt",
        "columnDefs": [ {
            "targets": -1,
            "data": null,
            "defaultContent": "<button id='alert'>Contact Now!</button>"
        } ]
    } );
 
    $('#example tbody').on( 'click', 'button', function () {
        var data = table.row( $(this).parents('tr') ).data();
        $("#error").html(data[2] +"'s Contact Number is: "+ data[ 4 ] );
      $('#myModal').modal("show");
      if (typeof data === "undefined") {
    console.log("variable is undefined");
}
    } );
} );

$(document).ready(function() {
    $('#example').DataTable();
} );

    </script>

Everything is fine with the table except when i am going to mobile view in chrome, modal window is not appearing when i click on the contact Now! button.

when i looked into the dev tools it is throwing a error like this "Uncaught TypeError: Cannot read property '2' of undefined".