bootstrap modal did not pop up after 10 records of pagination datatable in codeignit

Bootstrap modal did not pop up after 10 record of data table pagination. i don't know why so please help me. i had many tried to solve this but i cant understand this. I don't know idea about jquery so please give me ans.
Here is my php code:


<table id="example1" class="table table-bordered table-striped">
    <thead>
        <tr>
            <th>Sr No</th>
            <th>Title</th>
            <th>Description</th>
            <th>Status</th>
            <th>Deadline Date</th>
            <th>Add</th>
            <th>Show</th>
        </tr>
    </thead>
    <tbody>
     <?php
     $str = 1;
     foreach ($getplan as $key => $get) {
        ?>
        <tr>
            <td><?php echo $str; ?></td>
            <td><?php echo $get['title']; ?></td>
            <td><?php echo $get['description'] ?></td>
            <td><?php echo $get['color'] ?></td>
            <td><?php echo $get['end_date'];?></td>
            <td>
                <?php echo $get['members'] ?><br/>
                <a href="<?php echo base_url() . "welcome/get_member_id/" . $get['id'] ?>"<i class="fa fa-plus" aria-hidden="true"></i>Add Member</a>
            </td>

            <td>
                <input type="button" name="view" value="Show" id="<?php echo $get['id'] ?>" class="btn btn-info btn-xs view_data" />
            </td>

        </tr>
        <?php
        $str++;
    }
    ?>
</tbody>
</table>

Here is my Modal:

Code:

<div id="dataModal" class="modal fade">  
<div class="modal-dialog modal-lg">  
   <div class="modal-content">  
       <div class="modal-header">  
           <button type="button" class="close" data-dismiss="modal">&times;</button>  
           <h4 class="modal-title">Employee Tast Details</h4>  
       </div>  
       <div class="modal-body" id="employee_detail">
       </div>  
       <div class="modal-footer">  
           <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>  
       </div>  
   </div>  
</div>  

Here my script:

<script type="text/javascript">
    $(document).ready(function(){   
        $('.view_data').click(function(){  
            var employee_id = $(this).attr("id");
            $.ajax({  
                url:"<?php echo base_url('welcome/show'); ?>",  
                method:"post",  
                data:{employee_id:employee_id},  
                success:function(data)
                {  
                    $('#employee_detail').html(data);  
                    $('#dataModal').modal("show");  
                }  
            });  
        });  
    });  
</script>