 <div class="content-wrapper">
   <!-- Content Header (Page header) -->
   <div class="content-header">
     <div class="container-fluid">
       <div class="row mb-2">
         <div class="col-sm-6">
           <h1 class="m-0 text-dark">Manual Exam</h1>
         </div><!-- /.col -->
         <div class="col-sm-6">
           <ol class="breadcrumb float-sm-right">
             <li class="breadcrumb-item"><a href="<?php echo base_url() ?>admin/admin/dashboard">Dashboard</a></li>
             <li class="breadcrumb-item"><a href="#">Examination</a></li>
             <li class="breadcrumb-item active">Manual Exam</li>

           </ol>
         </div><!-- /.col -->
       </div><!-- /.row -->
     </div><!-- /.container-fluid -->
   </div>
   <!-- /.content-header -->
   <section class="content">
     <div class="container-fluid">

       <div class="row">
         <div class="col-sm-12">
           <div class="card card-default">

             <!-- /.card-header -->
             <div class="card-body">
               <div class="row">

                 <div class="col-md-7">
                   <div class="form-group">
                     <label for="inputEmail" class="col-sm-12 col-form-label">Select ATP <span class="required">*</span></label>
                     <div class="col-sm-12">
                       <select class="form-control" onchange="get_student_by_atp_id(this.value)" name="user_atp" placeholder="Enter Notice Content" required="required">
                         <option value="">Select</option>
                         <?php foreach ($all_atp as $atp) : ?>
                           <option value="<?php echo $atp->user_id; ?>"><?php echo $atp->user_business_name; ?></option>
                         <?php endforeach ?>
                       </select>
                     </div>
                   </div>
                 </div>

                 <div class="col-md-5">
                   <div class="form-group">
                     <label for="inputEmail" class="col-sm-12 col-form-label">Select Student <span class="required">*</span></label>
                     <div class="col-sm-12">
                       <select class="form-control" onchange="generate_table(this.value)" name="student_id" placeholder="Enter Notice Content" required="required" id="student_details">
                         <option value="">Select</option>
                       </select>
                     </div>
                   </div>
                 </div>

               </div>
             </div>
           </div>
         </div>
       </div>
     </div>
   </section>
                          
   <section class="content">
     <div class="container-fluid">
       <div class="card card-default" id="data">
       </div>
     </div><!--/. container-fluid -->
   </section>
   <!-- /.content -->
 </div>
 <script type="text/javascript">
   $(function() {
     $("#example2").DataTable({
       "responsive": true,
       "lengthChange": true,
       "autoWidth": false,
       "searching": true,
       info: false,
       paging: false,
     }).buttons().container().appendTo('#example1_wrapper .col-md-6:eq(0)');
   });

   function generate_table() {

     var student = $('#student_details').val();
     $.ajax({
       beforeSend: function() {
         $(".loader").show();
       },
       type: "POST",
       dataType: "JSON",
       async: true,
       data: {
         student: student
       },
       url: '<?php echo base_url(); ?>admin/students/get_all_course_data_for_manual_exam',
       success: function(data) {
         $('#data').html(data);
         $(".loader").hide();
       },
       error: function(e) {
         console.log(e.responseText)
         $(".loader").hide();
       }
     });
   }

   function get_student_by_atp_id(e) {
     $.ajax({
       beforeSend: function() {
         $(".loader").show();
       },
       type: "GET",
       dataType: "JSON",
       async: true,
       url: '<?php echo base_url(); ?>admin/students/get_all_student_by_atp_id/' + e,
       success: function(data) {
         $('#student_details').html(data.option);
         $(".loader").hide();
       },
       error: function(e) {
         console.log(e.responseText)
         $(".loader").hide();
       }
     });
   }
 </script>
 <style type="text/css">
   .check-box {}
 </style>