Весь файл JavaScript не загружает все страницы таблицы данных

Question

Я использую таблицу данных с материализацией CSS.В определенном столбце я делаю свой выигранный контроль. Я имею в виду, что я делаю выпадающий параметр для изменения ячейки столбца.Хорошо работает на первой странице таблицы данных.Но после первой страницы это не работает.Я ищу эту проблему в Google, но не могу найти решение, которое мне подходит.Вот мой HTML-код:

 <table id="data-table-simple" class="bordered striped highlight responsive-table">
            <thead>
                <tr>
                    <th>Guest name</th>
                    <th>Guest email</th>
                    <th>Reff</th>
                    <th>Reciept</th>
                    <th>Status</th>
                    <th>Payment date</th>
                    <!-- <th>Photo</th> -->
                </tr>
            </thead>
            <tbody id="show_data"></tbody>
        </table>

Вот мой код JQuery:

$(document).ready(function(e){
$('#data-table-simple').DataTable();
show_payment();
});


function show_payment(){
$.ajax({
    type  : 'post',
    url   : 'payment/get_all_payment',
    async : false,
    dataType : 'json',
    success : function(data){
       // console.log(data);
        var html = '';
        var i;
        var status;
         var base_url = window.location.origin;
         var pathArray = window.location.pathname.split( '/' );
        for(i=0; i<data.length; i++){
            var image_location = base_url+'/'+pathArray[1]+'/'+pathArray[2]+'/images/payment_reciept/'+data[i].payment_receipt;
            html += '<tr>'+
                    '<td>'+data[i].name+'</td>'+
                    '<td>'+data[i].email+'</td>'+
                    '<td>'+data[i].reff+'</td>'+
                    '<td><img class="materialboxed" width="100" height="90" src="'+image_location+'" alt=""></td>'+
                    '<td>'+
                    '<select name="select_room_type">'+
                        '<option value="" disabled selected>'+data[i].status+'</option>'+
                        '<option value="confirmed">Confirmed</option>'+
                        '<option value="cancel">Cancel</option>'+
                    '</select>'+
                    '</td>'+
                    '<td>'+data[i].created_date_time+'</td>'+
                    '</tr>';
        }
        $('#show_data').html(html);
    }
});

}

Вот мой вывод для первой страницы в таблице данных Здесь весь код и функция JavaScript работают хорошо

Вот мой вывод для второй страницы таблицы данных Здесь код JavaScript не работает.

СейчасПожалуйста, помогите мне, как я могу решить эту проблему.