BBnepal-Accounts/application/views/student/student-route-batch.php

<style type="text/css">
  .fa-eye:hover{
    color: black;
  }
</style>
<main class="common_margin" id="main"> 
  <div class="main-wrap">
    <div class="my-info-inner">   
      <div class="breadcrumb-section">
        <ol class="breadcrumb breadcrumb-back"> 
          <a href="<?php echo base_url()?>student/dashboard">   
            <li class="breadcrumb-item"> Back</li>  
          </a>
        </ol>
      </div>
      
    </div>
    <form id="bus_fee_form" method="POST" action="<?php echo base_url()?>student/bus-fee">
      <div class="w-100">        
      
          <table id="tbl1" class="display table-responsive w-100">
              <thead>
                  <tr>
                     
                      <th>Route Name</th>
                      <th>Pickup Start Time</th>
                      <th>Drop Start Time</th>
                      <th>Amount</th>
                      <th>Action</th>
                  </tr>
              </thead>
              <tbody>
                  <?php
                  if (isset($route_data) && !empty($route_data)) {

                  foreach($route_data as $key => $value){ ?>
                  <tr>
                      
                      <td ><?php echo $value['route_name'] ?></td>
                      <td class="text-center"><?php echo date('h:i a ', strtotime($value['pickup_start'])) ?></td>
                      <td class="text-center"><?php echo date('h:i a ', strtotime($value['drop_start'])) ?></td>
                      <td class="text-center" style="color: <?php echo $value['color']; ?>"><?php echo $value['amount']; ?></td>
                      <td class="text-center">
                        <div class="sub_tabbtnsec" title="view">  
                          <a href="#" onclick="pop_up_data(<?php echo $value['id']; ?>)" style="color: #1c6aad;" class="hover_change">
                            <i class="fa fa-eye" aria-hidden="true"></i>
                          </a>                           
                            
                        </div>
                      </td>
                  </tr>
              <?php } } else{ ?>
                  <tr colspan="4"> No Data found</tr>
              <?php } ?>
              </tbody>
          </table>
          </div>
    </form>
  </div>  
  <div class="viewDoc accept-modal-wrap">
        <div class="modal fade " id="confirmModal" role="dialog">
            <div class="modal-dialog modal-dialog-centered">
                <div class="modal-content bg-light" >
                  <div class="modal-header" style="border-bottom: none;">
                    <h5 class="modal-title" id="exampleModalLongTitle">Route Details</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                      <span aria-hidden="true">&times;</span>
                    </button>
                  </div>                    
                  <div class="model-body">
                    <div class="container">
                      <div class="row justify-content-md-center">
                        <div class="col-md-12">
                          <table class="table" id="drop_list">
                            <thead>
                              <tr>
                                <th>SI No</th>
                                <th>Stop Name</th>
                              </tr>
                            </thead>
                            <tbody class="list_drop">
                              
                            </tbody>
                          </table>
                        </div>
                      </div>
                    </div>                      
                      
                  </div>
                </div>
            </div>
        </div>
    </div>
<style type="text/css">
  .error{
    color: red;
  }
</style>
<script>   


     $(document).ready(function() {
        $('.user-drpdown').click(function() {
            $('.drpdown-items').toggle();
        });

        //table js
        $('#tbl1').DataTable({
          scrollX:        "100%",
          columnDefs: [
            { width: '20%', targets: 1 }
        ],
            "lengthMenu": [
                [5, 10, 25, 50, -1],
                [5, 10, 25, 50, "All"]
            ],
            dom: 'lBfrtip',
            buttons: [{
                    extend: 'pdfHtml5',
                    title: 'Student List',
                    exportOptions: {
                        columns: [1, 3, 4, 5, 6, 7]
                    }
                },
                {
                    extend: 'csvHtml5',
                    exportOptions: {
                        columns: [1, 3, 4, 5, 6, 7]
                    }
                }
            ]
        });

        //table js end
        //multiple select js start
        $('select').selectpicker();
        //multiple select js end
    });  

    function pop_up_data(id)
    {
      $.ajax({
          url : '<?php echo base_url() ?>' +'student/get_route_price_list',
          data : {
            route_id : id
          },
          type : 'POST',
          async : false,
          success: function(data){
            var result = JSON.parse(data);
            if(data == ''){
              
            }else{
              var d ='';
               $.each(result, function(k, v) {
                  k++;
                  d += '<tr><td>'+ k +'</td><td>'+ v['place_name']+'</td></tr>';
               });
              
              $('.list_drop').html(d);
               $("#confirmModal").modal('show');
            }
          }
        });
      // $("#confirmModal").modal('show');
    } 
</script>

</main>