
<!--Update Exams-->
  <div class="modal fade" id="Examupdate">
        <div class="modal-dialog modal-xl">
          <div class="modal-content">
            <div class="modal-header">
              <h6 class="modal-title text-success" >Update Exam Data</h6>
              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
              </button>
            </div>
            <div class="modal-body">
               <div class="row">
              <div class="col-md-12"> 
              <h5 class="m-0 text-success"><label id=""></label></h5>
                <div class="modal-body">
                  <form action="" method="POST" onsubmit="return false">
                        <input type="hidden" id="exaidholder" />
                       
                       <div class="row">
                        <div class="col-md-4 col-12">
                        <div class="form-group">
                        <label for="inputStatus">Exam Title <span class="text-danger">*</span></label>
                        <input type="text" name="" id="txtonee" class="form-control" />
                        </div>
                        </div>
                        
                        <div class="col-md-2 col-12">
                        <div class="form-group">
                            <label for="inputStatus">Period <span class="requireds">*</span></label>
                            <select id="txttwoo" class="form-control custom-select" required>
                            <option selected disabled value="">Select ---</option>
                            <option value="Pre End">Pre End</option>
                            <option value="End Term">End Eerm</option>
                        
                            </select>
                            </div>
                        </div>
                        
                        <div class="col-md-2 col-12">
                        <div class="form-group">
                            <label for="inputStatus">Start Date <span class="requireds">*</span></label>
                        <input type="date" name="" id="txtthreee" class="form-control" />
                        </div>
                        </div>
                        
                        <div class="col-md-2 col-12">
                        <div class="form-group">
                            <label for="inputStatus">End Date <span class="requireds">*</span></label>
                        <input type="date" name="" id="txtfourr" class="form-control" />
                        </div>
                        </div>
                        
                        <div class="col-md-2 col-12">
                            <div class="form-group">
                         <label id="" style="color:#FFF">.</label> <br />
                           <button style="margin-right:0px;position:relative" class="btn btn-info btn-sm pull-right" id="saveexamm"><i class="fa fa-save"></i> Update
                        </button>
                       </div>
                        </div>
                        </div>
                  </form>
                  <center><label id="exammsgg"></label></center>
                </div>
              </div>  
            <a href="#" id="advancedbtn"> Advanced <i class="fa fa-cog"></i></a>
            </div>
            </div>
            <div class="modal-footer">
               <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
      </div>
          </div>
          <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
      </div>


<div class="modal fade" id="modaladvanced">
<div class="modal-dialog modal-md">
  <div class="modal-content">
    <div class="modal-header">
      <h6 class="modal-title text-success" ><strong>This panel is applicable to all classes</strong></h6>
      <button type="button" class="close" data-dismiss="modal" aria-label="Close">
        <span aria-hidden="true">&times;</span>
      </button>
    </div>
    <div class="modal-body">
       <div class="row">
      <div class="col-md-12"> 
      <label id="exammmmu" class="text-danger"></label>
        <div class="modal-body">
            <h6><center style="color:#000;font-weight:900"><u>Set what this Exam is marked OUT OF</u></center></h6>
          <form action="" method="POST" onsubmit="return false">
                <div class="row">
                   
                <div class="col-md-12 col-12">
                    
                    <ul class="nav nav-tabs">
                    <li class="nav-item">
                    <a class="nav-link active" data-toggle="tab" href="#g123">Grade 1-3</a>
                    </li>
                    <li class="nav-item">
                    <a class="nav-link" data-toggle="tab" href="#g456">Grade 4-6</a>
                    </li>
                     <li class="nav-item">
                    <a class="nav-link" data-toggle="tab" href="#g789">Grade 7-9</a>
                    </li>
                    </ul>
                    
                    <div class="tab-content" style="width:100%;width: 100%;
                    max-width: none;height: 100%;margin: 0;">
                    
                    <div id="g123" class="tab-pane active" style="width:100%;width: 100%;
                    max-width: none;height: 100%;margin: 0;">
                    
                    <table class="table">
                    <tr>
                        <td>Select Class</td>
                        <td>
                     <select id="classclass" style="font-size:12px"  class="" required style="" onchange="myFunctionclass()">
                    <option value="">---</option>
                    <option value="GRADE 1">GRADE 1</option>
                    <option value="GRADE 2">GRADE 2</option>
                    <option value="GRADE 3">GRADE 3</option>
                    </select>
                    </td>
                    </tr>
                    <tr>
                        <td>Maths</td>
                        <td><input type="text" id="mas" />
                        </td>
                        
                    </tr>
                    <tr>
                        <td>English</td>
                        <td><input type="text" id="ens" />
                        </td>
                    </tr>
                    <tr>
                  
                        <td>Kiswahili</td>
                        <td>
                        <input type="text" id="kiss" />
                        </td>
                    </tr>
                    <tr>
                        <td>CRE</td>
                        <td>
                        <input type="text" id="CRe" />
                        </td>
                    </tr>
                    <tr>
                        <td>Environmental Activities</td>
                        <td>
                        <input type="text" id="EAc" />
                        </td>
                    </tr>
                    <tr>
                        <td>Creative Arts</td>
                        <td>
                        <input type="text" id="CAr" />
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2">
                             <button style="margin-right:0px;position:relative" class="btn btn-info btn-sm btn-block" id="saveoutof"><i class="fa fa-save"></i> Save
                            </button>
                       </td>
                    </tr>
                </table>
                </div>
                <div id="g456" class="tab-pane" style="width: 100%;
                    max-width: none;margin: 0;">
                    
                     <table class="table">
                    <tr>
                        <td>Select Class</td>
                        <td>
                    <select id="cla456" style="font-size:12px"  class="" required style="" onchange="get4to6()">
                    <option value="">---</option>
                    <option value="GRADE 4">GRADE 4</option>
                    <option value="GRADE 5">GRADE 5</option>
                    <option value="GRADE 6">GRADE 6</option>
                    </select>
                    </td>
                    </tr>
                    <tr>
                        <td>Maths</td>
                        <td><input type="text" id="mas2" />
                        </td>
                        
                    </tr>
                    <tr>
                        <td>English</td>
                        <td><input type="text" id="ens2" />
                        </td>
                    </tr>
                    <tr>
                  
                        <td>Kiswahili</td>
                        <td>
                        <input type="text" id="kiss2" />
                        </td>
                    </tr>
                    <tr>
                        <td>CRE</td>
                        <td>
                        <input type="text" id="CRe2" />
                        </td>
                    </tr>
                    <tr>
                        <td>Integrated Science</td>
                        <td>
                        <input type="text" id="EAc2" />
                        </td>
                    </tr>
                    <tr>
                        <td>Creative Arts</td>
                        <td>
                        <input type="text" id="CAr2" />
                        </td>
                    </tr>
                    
                     <tr>
                        <td>Agriculture & Nutrition</td>
                        <td>
                        <input type="text" id="AnN" />
                        </td>
                    </tr>
                     <tr>
                        <td>Social Studies</td>
                        <td>
                        <input type="text" id="SoS" />
                        </td>
                    </tr>
                    
                    <tr>
                        <td colspan="2">
                             <button style="margin-right:0px;position:relative" class="btn btn-success btn-sm btn-block" id="saveoutofupper"><i class="fa fa-save"></i> Save
                            </button>
                       </td>
                    </tr>
                </table>
                </div>
                
                
                 <div id="g789" class="tab-pane" style="width:100%;width: 100%;
                    max-width: none;height: 100%;margin: 0;">
                    
                     <table class="table">
                    <tr>
                        <td>Select Class</td>
                        <td>
                     <select id="cla78" style="font-size:12px"  class="" required style="" onchange="myFunctionclass3()">
                    <option value="">---</option>
                    <option value="GRADE 7">GRADE 7</option>
                    <option value="GRADE 8">GRADE 8</option>
                    <option value="GRADE 9">GRADE 9</option>
                    </select>
                    </td>
                    </tr>
                    <tr>
                        <td>Maths</td>
                        <td><input type="number" id="umas2" />
                        </td>
                        
                    </tr>
                    <tr>
                        <td>English</td>
                        <td><input type="number" id="uens2" />
                        </td>
                    </tr>
                    <tr>
                  
                        <td>Kiswahili</td>
                        <td>
                        <input type="number" id="ukiss2" />
                        </td>
                    </tr>
                    <tr>
                        <td>CRE</td>
                        <td>
                        <input type="number" id="uCRe2" />
                        </td>
                    </tr>
                    <tr>
                        <td>Integrated Science</td>
                        <td>
                        <input type="number" id="uEAc2" />
                        </td>
                    </tr>
                    <tr>
                        <td>Creative Arts</td>
                        <td>
                        <input type="number" id="uCAr2" />
                        </td>
                    </tr>
                    
                     <tr>
                        <td>Agriculture & Nutrition</td>
                        <td>
                        <input type="number" id="uAnN" />
                        </td>
                    </tr>
                     <tr>
                        <td>Social Studies</td>
                        <td>
                        <input type="number" id="uSoS" />
                        </td>
                    </tr>
                    
                     <tr>
                        <td>Pre-Technical</td>
                        <td>
                        <input type="number" id="Ptec" />
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2">
                             <button style="margin-right:0px;position:relative" class="btn btn-primary btn-sm btn-block" id="saveoutof3"><i class="fa fa-save"></i> Save
                            </button>
                       </td>
                    </tr>
                </table>
                </div>
                </div>
                </div>
               
                </div>
          </form>
          <center><label id="exammsgg"></label></center>
        </div>
      </div>  
    </div>
    </div>
    <div class="modal-footer">
       <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
  </div>
  <!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>


<div class="modal fade" id="ExamEntry">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="modal-header">
  <h6 class="modal-title text-success" > Marks Entry </h6>
  <button type="button" class="close" data-dismiss="modal" aria-label="Close">
    <span aria-hidden="true">&times;</span>
  </button>
</div>
            
<div class="modal-body">
   <div class="row">
  <div class="col-md-12"> 
  <h5 class="m-0 text-success"><label id=""></label></h5>
    <div class="modal-body">
                    
 <ul class="nav nav-tabs">
     <li class="nav-item">
      <a class="nav-link active" data-toggle="tab" href="#menu11">Competency-Based Curriculum (CBC)</a>
    </li>
 </ul>
  
  <!-- Tab panes -->
<div class="tab-content" style="width:100%;width: 100%;
  max-width: none;height: 100%;margin: 0;">
    
<div id="homee" class="tab-pane" style="width:100%;width: 100%;
  max-width: none;height: 100%;margin: 0;">
 
<div class="row ">  
<div class="col-md-6 a"> 
<div class="col-md-12">   
<div class="form-group">
<label for="inputStatus">Select Exam </label>
<select id="examid" class="form-control custom-select" required onchange="myFunctionn()">
<option selected value="">---</option>
<?php                  
$query=mysqli_query($con,"select * FROM Exam ORDER BY id DESC");
while($row=mysqli_fetch_array($query))
{
?>
<option value="<?php echo $row['id']; ?>"> <?php echo $row['Title'].' '.'('.$row['Month'].' '.$row['Year'].')';  ?></option>
<?php
}
?>
</select>
</div>
</div>

<div class="col-md-12">   
<div class="form-group">
<label for="inputStatus">Select Pupil</label>
<select id="Selectpupi"  class="form-control custom-select" required style="width:100%;height:40px" onchange="myFunction()" disabled>
<option selected value="">---</option>
<?php                  
$query=mysqli_query($con,"select * FROM pupils where Status='Active' AND Claz='CLASS 8' ORDER BY Names ASC");
while($row=mysqli_fetch_array($query))
{
?>
<option value="<?php echo $row['count']; ?>"> <?php echo $row['Names'].' - '.$row['AdmNo'].' ('.$row['Claz'].')';  ?></option>
<?php
}
?>
</select>
</div>
<div class="form-group">
  <label>Class: </label> <label id="labelclass" class="text-danger"></label>  <br />
  <label>Class Teacher: </label>  <label id="labelclassteacher" class="text-danger"></label> 
</div>
</div>
</div>
</div>
</div>

    
<div id="menu11" class="tab-pane active" style="width:100%">
<div class="row" style="width:100%">  
<div class="col-md-4">   
<div class="form-group">
<select id="exaamu" class="form-control custom-select" style="font-size:12px" required onchange="myFunctionn()">
<option selected value="">Select Exam</option>
<?php                  
$query=mysqli_query($con,"select * FROM Exam ORDER BY id DESC");
while($row=mysqli_fetch_array($query))
{
?>
<option value="<?php echo $row['id']; ?>"> <?php echo $row['Title'].' '.'('.$row['Month'].' '.$row['Year'].')';  ?></option>
<?php
}
?>
</select>
</div>
</div>


<div class="col-md-3">   
<div class="form-group">
<select id="gre" style="font-size:12px"  class="form-control custom-select" required style="width:100%;height:40px" onchange="myFunction()">
    <option selected disabled value="">Select Class</option>
    <option value="GRADE 1">GRADE 1</option>
    <option value="GRADE 2">GRADE 2</option>
    <option value="GRADE 3">GRADE 3</option>
    <option value="GRADE 4">GRADE 4</option>
    <option value="GRADE 5">GRADE 5</option>
    <option value="GRADE 6">GRADE 6</option>
    <option value="GRADE 7">GRADE 7</option>
    <option value="GRADE 8">GRADE 8</option>
    <option value="GRADE 9">GRADE 9</option>
</select>
</div>
</div>

<div class="col-md-2">   
<div class="form-group">
 <button class="btn btn-success" title="Click to Filter" id="filterpupils"> <i class="fa fa-refresh fa-spin"></i>
 </button>
</div>

<input type="hidden" id="exaexa" />
<input type="hidden" id="clcl" />
</div>
</div

<div class="row">  
<div class="col-md-12"> 
 <p><u><strong class="">Add Marks to the respective field </strong></u></p>
 <label id="examlabel" style="color:red"></label>
 <div class="table-responsive" id="">
 <div id="scoretable"></div>
 
   <!--button class="btn btn-success btn-sm pull-right savefetched" id="savefetched"><i class="fa fa-save"></i> Submit</button-->
 </div>

</div>
</div>
</div>
  
</div> 
    </div>
  </div>  

</div>
</div>
</div>
<!-- /.modal-content -->
</div>


<!--Exam Setting Modal -->
<div class="modal fade" id="Examsetting">
        <div class="modal-dialog">
          <div class="modal-content">
            <div class="modal-header">
              <h6 class="modal-title text-success" >Set Total Marks to Various Subjects</h6>
              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
              </button>
            </div>
            <div class="modal-body">
               <div class="row">
              <div class="col-md-12"> 
              <h5 class="m-0 text-success"><label id=""></label></h5>
                <div class="modal-body">
                    
 <ul class="nav nav-tabs">
    <li class="nav-item">
      <a class="nav-link active" data-toggle="tab" href="#home">Upper Classes</a>
    </li>
    <li class="nav-item">
      <a class="nav-link" data-toggle="tab" href="#menu1">Lower Classes</a>
    </li>
  </ul>

  <!-- Tab panes -->
  <div class="tab-content">
      
    <div id="menu1" class="container tab-pane fade"><br>
    <table class="table">
<thead>
    <tr>
        <th>LEARNING AREA</th>
        <th> OUT OF</th>
    </tr>
</thead>

<tr>
    <td>ENGLISH ACTIVITY</td>
    <td><input type="text" class="" /></td>
</tr>

<tr>
    <td>MATHEMATICS ACTIVITY</td>
    <td><input type="text" class="" /></td>
</tr>
<tr>
    <td>KISWAHILI ACTIVITY</td>
    <td><input type="text" class="" /></td>
</tr>
<tr>
    <td>INTEGRATED LEARNING AREAS</td>
    <td><input type="text" class="" /></td>
</tr>

<tr>
    <td><label id="" style="color:#FFF"></label></td>
    <td><button style="margin-right:0px;position:relative" class="btn btn-success btn-sm pull-right" id=""><i class="fa fa-save"></i> Save
</button>
</td>
</tr>
</table>
    </div>
  </div>
</div> 
            
    </div>
  </div>  

</div>
</div>
</div>
<!-- /.modal-content -->
</div>
        <!-- /.modal-dialog -->
      
     
       <div class="modal fade" id="Examsmodal">
        <div class="modal-dialog modal-xl">
          <div class="modal-content">
            <div class="modal-header">
              <h6 class="modal-title text-success" >Add Exam</h6>
              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
              </button>
            </div>
            <div class="modal-body">
               <div class="row">
              <div class="col-md-12"> 
              <h5 class="m-0 text-success"><label id="usalabell"></label></h5>
                <div class="modal-body">
                  <form action="" method="POST" onsubmit="return false">
                        <input type="hidden" id="" />
                       
                       <div class="row">
                        <div class="col-md-4 col-12">
                        <div class="form-group">
                        <label for="inputStatus">Exam Title <span class="text-danger">*</span></label>
                        <input type="text" name="" id="txtone" class="form-control" />
                        </div>
                        </div>
                        
                        <div class="col-md-2 col-12">
                        <div class="form-group">
                            <label for="inputStatus">Period <span class="requireds">*</span></label>
                            <select id="txttwo" class="form-control custom-select" required>
                            <option selected disabled value="">Select ---</option>
                            <option value="Opener">Opener</option>
                            <option value="Mid term">Mid term</option>
                            <option value="End Term">End Eerm</option>
                            <option value="Others">Others</option>
                        
                            </select>
                            </div>
                        </div>
                        
                        <div class="col-md-2 col-12">
                        <div class="form-group">
                            <label for="inputStatus">Start Date <span class="requireds">*</span></label>
                        <input type="date" name="" id="txtthree" class="form-control" />
                        </div>
                        </div>
                        
                        <div class="col-md-2 col-12">
                        <div class="form-group">
                            <label for="inputStatus">End Date <span class="requireds">*</span></label>
                        <input type="date" name="" id="txtfour" class="form-control" />
                        </div>
                        </div>
                        
                        <div class="col-md-2 col-12">
                            <div class="form-group">
                         <label id="" style="color:#FFF">.</label> <br />
                           <button style="margin-right:0px;position:relative" class="btn btn-success btn-sm pull-right" id="saveexam"><i class="fa fa-save"></i> Save
                        </button>
                       </div>
                        </div>
                        </div>
                      
                  </form>
                  <center><label id="exammsg"></label></center>
                </div>
              </div>  
        
            </div>
            </div>
          </div>
          <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
      </div>


       <div class="modal fade" id="classteachersmodal">
        <div class="modal-dialog modal-lg">
          <div class="modal-content">
            <div class="modal-header">
              <h6 class="modal-title text-success" >Assign Class Teachers</h6>
              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
              </button>
            </div>
            <div class="modal-body">
               <div class="row">
              <div class="col-md-12"> 
              <h5 class="m-0 text-success"><label id="usalabell"></label></h5>
                <div class="modal-body">
                  <form action="" method="POST" onsubmit="return false">
                       <input type="hidden" id="" />
                       <div class="row">
                           
                        <div class="col-md-5 col-12">
                        <div class="form-group">
                        <label for="inputStatus">Select Teacher <span class="text-danger">*</span></label>
                        
                        <select id="Selectteachers" class="form-control custom-select" required style="width:100%;">
                        <option selected value="">---</option>
                        <?php                  
                        $query=mysqli_query($con,"select * FROM Staffs where Status='Active' AND Position='Teacher' ORDER BY Name ASC");
                        while($row=mysqli_fetch_array($query))
                        {
                        ?>
                        <option value="<?php echo $row['id']; ?>"> <?php echo $row['Name'];  ?></option>
                        <?php
                        }
                        ?>
                        </select>
                        </div>
                        </div>
                        
                        <div class="col-md-5 col-12">
                        <div class="form-group">
                            <label for="inputStatus">Class <span class="requireds">*</span></label>
                            <select id="clazz" class="form-control custom-select" required>
                            <option selected disabled value="">Select ---</option>
                            <option value="BABY CLASS">BABY CLASS</option>
                            <option value="PP1">PP1</option>
                            <option value="PP2">PP2</option>
                            <option value="GRADE 1">GRADE 1</option>
                            <option value="GRADE 2">GRADE 2</option>
                            <option value="GRADE 3">GRADE 3</option>
                            <option value="GRADE 4">GRADE 4</option>
                            <option value="GRADE 5">GRADE 5</option>
                            <option value="GRADE 6">GRADE 6</option>
                            <option value="GRADE 7">GRADE 7</option>
                            <option value="GRADE 8">GRADE 8</option>
                            <option value="GRADE 9">GRADE 9</option>
                            <option value="CLASS 8">CLASS 8</option>
                            </select>
                            </div>
                        </div>
                        
                        <div class="col-md-2 col-12">
                            <div class="form-group">
                         <label id="mesage" style="color:#FFF">.</label> <br />
                           <button style="margin-right:0px;position:relative" class="btn btn-info btn-sm pull-right" id="finish"><i class="fa fa-refresh"></i> Finish
                        </button>
                       </div>
                        </div>
                        </div>
                  </form>
                  
                  <div class="row">
                     <div class="col-md-12 col-12">
                  <center><label>Registered Teachers with their respective classes they administer</label></center>
                    <table class="table table-hover table-success" id="tablestaffsss" style="width:100%">
                     <thead>
                         <tr>
                             <th colspan="5"><label id="techersavemsg"></label></th>
                         </tr>
                         <tr>
                             <th>#</th>
                             <th>Class</th>
                             <th>Contact</th>
                             <th>In-Charge Of</th>
                             <th>Action</th>
                         </tr>
                     </thead>
                     <tbody>
                        <?php
                        $query=mysqli_query($con,"select Classteachers.*,Staffs.Name as nm,Staffs.Phone as ph from Classteachers left join Staffs ON Staffs.id=Classteachers.Teacher ORDER BY Classteachers.Clazzz ASC");
                        $cnt=1;
                        while($row=mysqli_fetch_array($query))
                        {
                          ?>  
                          <tr class="">
                			<td><?php echo $cnt; ?></td>
                			<td><?php echo $row["nm"]; ?></td>
                			<td><?php echo $row["ph"]; ?></td>
                			<td><?php echo $row["Clazzz"]; ?></td>
                			<td>
                			    <input type="hidden" value="<?php echo $row["count"]; ?>" class="techerid" />
                			    <i class="fa fa-trash text-danger btn deleteachers"></i>
                			</td>
                		</tr>
                         <?php  
                         $cnt=$cnt+1;
                        }
                	?>
                     </tbody>
                 </table>
                 </div>
                 </div>
                </div>
              </div>  
        
            </div>
            </div>
          </div>
          <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
      </div>
      
      
     <!--Add Exam Records -->
     
     
     
     <div class="modal fade" id="Records">
        <div class="modal-dialog modal-md">
          <div class="modal-content">
            <div class="modal-header">
              <h6 class="modal-title text-success" >Update Leaner's Marks</h6>
              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
              </button>
            </div>
            <div class="modal-body">
               <div class="row">
              <div class="col-md-8"> 
              <h5 class="m-0 text-success"><label id=""></label></h5>
                <div class="modal-body">
                  <form action="" method="POST" onsubmit="return false">
                        <input type="hidden" id="" />
                       
                       <div class="row">
                                <div class="col-md-12 col-12">
                                    <p style="position:absolute:margin-top:-15px"><strong>Learner: </strong> <span id="learner"> </span></p>
                                  <table class="table-bordered" style="font-family:Tahoma;font-size:12px;width:100%">
                                      <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">Maths  <span class="max"  id="maxma"></span></label>
                                                <input type="text" style="height:20px;font-size:18px;font-weight:bold"  name="" onkeypress="return /[0-9]/i.test(event.key)" id="mathe" class="maxent" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="rma" class="" >
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                      
                                        <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">English <span class="max"  id="maxen"></span></label>
                                                <input type="text" style="height:20px;font-size:18px;font-weight:bold" name="" id="enga" onkeypress="return /[0-9]/i.test(event.key)" class="" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="ruenga" class="">
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                      
                                        <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">Kiswahili <span class="max"  id="maxki"></span></label>
                                                <input type="text" name="" style="height:20px;font-size:18px;font-weight:bold" id="kisa" onkeypress="return /[0-9]/i.test(event.key)" class="" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="rukisa" class="">
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                        <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">CRE <span class="max"  id="maxcr"></span></label>
                                                <input type="text" name=""  style="height:20px;font-size:18px;font-weight:bold" onkeypress="return /[0-9]/i.test(event.key)" id="bible" class="" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="rubible" class="">
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                      
                                        <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">Creative Arts <span class="max" id="maxca"></span></label>
                                                <input type="text" name="" style="height:20px;font-size:18px;font-weight:bold" id="crea" onkeypress="return /[0-9]/i.test(event.key)" class="" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="rucrea" class="" >
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                      
                                      
                                        <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">Environmental Activities <span class="max"  id="maxea"></span></label>
                                                <input type="text" name="" style="height:20px;font-size:18px;font-weight:bold" onkeypress="return /[0-9]/i.test(event.key)" id="EAs" class="" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="ruEAs" class="" >
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                      
                                   
                                       <tr style="background-color:#d1e0e0">
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">Overall Performance </label>
                                                <input type="text" name="" disabled id="OP" class="" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="ruOP" class="" required>
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                      
                                      <tr>
                                          <input type="hidden" id="mid" />
                                          <td colspan="2"><button class="btn btn-success btn-sm pull-right" id="savesave">Save</button></td>
                                      </tr>
                                  </table>  
                                </div>
                        </div>
                  </form>
                  <center><label id="savemessage"></label></center>
                </div>
              </div>  
        
            </div>
            </div>
          </div>
          <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
      </div>
      
      
      <div class="modal fade" id="Modalupper">
        <div class="modal-dialog modal-md">
          <div class="modal-content">
            <div class="modal-header">
              <h6 class="modal-title text-success" >Add Learner's Scores</h6>
              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
              </button>
            </div>
            <div class="modal-body">
               <div class="row">
              <div class="col-md-8"> 
              <h5 class="m-0 text-success"><label id=""></label></h5>
                <div class="modal-body">
                  <form action="" method="POST" onsubmit="return false">
                        <input type="hidden" id="" />
                       
                       <div class="row">
                                <div class="col-md-12 col-12">
                                    <p style="position:absolute:margin-top:-15px"><strong>Learner: </strong> <span id="learnerrr"> </span></p>
                                  <table class="table-bordered" style="font-family:Tahoma;font-size:12px;width:100%">
                                      <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">Maths <span class="max"  id="maxma"></span></label>
                                                <input type="text" style="height:20px;font-size:18px;font-weight:bold"  name="" onkeypress="counttotal()" id="matheee" class="maxent" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="rmaaa" class="" >
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                      
                                        <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">English <span class="max"  id="maxen"></span></label>
                                                <!--input type="text" style="height:20px;font-size:18px;font-weight:bold" name="" id="engaa" onkeypress="return /[0-9]/i.test(event.key)" class="" /-->
                                                <input type="number" style="height:20px;font-size:18px;font-weight:bold" id="englii" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="ruengaaa" class="">
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                      
                                        <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">Kiswahili <span class="max"  id="maxki"></span></label>
                                                <input type="text" name="" style="height:20px;font-size:18px;font-weight:bold" id="kisaaa" onkeypress="return /[0-9]/i.test(event.key), counttotal()" class="" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="rukisaaa" class="">
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                        <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">CRE <span class="max"  id="maxcr"></span></label>
                                                <input type="text" name=""  style="height:20px;font-size:18px;font-weight:bold" onkeypress="return /[0-9]/i.test(event.key), counttotal()" id="bibleee" class="" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="rubibleee" class="">
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                      
                                        <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">Creative Arts <span class="max" id="maxca"></span></label>
                                                <input type="text" name="" style="height:20px;font-size:18px;font-weight:bold" id="creaaa" onkeypress="return /[0-9]/i.test(event.key), counttotal()" class="" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="rucreaaa" class="" >
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                      
                                      
                                        <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">Social Studies<span class="max"  id="maxea"></span></label>
                                                <input type="text" name="" style="height:20px;font-size:18px;font-weight:bold" onkeypress="return /[0-9]/i.test(event.key), counttotal()" id="Socii" class="" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="rusocii" class="" >
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                      
                                        <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">Integrated Science<span class="max"  id="maxea"></span></label>
                                                <input type="text" name="" style="height:20px;font-size:18px;font-weight:bold" onkeypress="return /[0-9]/i.test(event.key), counttotal()" id="stee" class="" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="rustee" class="" >
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                      
                                      
                                       <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">Agriculture & Nutrition<span class="max"  id="maxea"></span></label>
                                                <input type="text" name="" style="height:20px;font-size:18px;font-weight:bold" onkeypress="return /[0-9]/i.test(event.key), counttotal()" id="agii" class="" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="ruagii" class="" >
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                      
                                         <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">Pre-technical Studies<span class="max"  id="maxpre"></span></label>
                                                <input type="text" name="" style="height:20px;font-size:18px;font-weight:bold" onkeypress="return /[0-9]/i.test(event.key), counttotal()" id="pretec" class="" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="rupretec" class="" >
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                      
                                   
                                       <tr style="background-color:#d1e0e0">
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">Overall Performance </label>
                                                <input type="text" name="" disabled  id="OPPP" class="" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="ruOPPP" class="" required>
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr-->
                                      
                                      <tr>
                                          <input type="hidden" id="upper1id" />
                                          <td colspan="2"><button class="btn btn-success btn-sm pull-right" id="saveupper2">Save</button></td>
                                      </tr>
                                  </table>  
                                </div>
                        </div>
                  </form>
                  <center><label id="savemessage"></label></center>
                </div>
              </div>  
        
            </div>
            </div>
          </div>
          <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
      </div> 
      
      
       <div class="modal fade" id="Recordsmodal">
        <div class="modal-dialog modal-md">
          <div class="modal-content">
            <div class="modal-header">
              <h6 class="modal-title text-success" >Add Learner's Scores</h6>
              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
              </button>
            </div>
            <div class="modal-body">
               <div class="row">
              <div class="col-md-8"> 
              <h5 class="m-0 text-success"><label id=""></label></h5>
                <div class="modal-body">
                  <form action="" method="POST" onsubmit="return false">
                        <input type="hidden" id="" />
                       
                       <div class="row">
                                <div class="col-md-12 col-12">
                                    <p style="position:absolute:margin-top:-15px"><strong>Learner: </strong> <span id="learnerrr"> </span></p>
                                  <table class="table-bordered" style="font-family:Tahoma;font-size:12px;width:100%">
                                      <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">Maths <span class="max"  id="maxma"></span></label>
                                                <input type="text" style="height:20px;font-size:18px;font-weight:bold"  name="" onkeypress="counttotal()" id="mathee" class="maxent" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="rmaa" class="" >
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                      
                                        <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">English <span class="max"  id="maxen"></span></label>
                                                <!--input type="text" style="height:20px;font-size:18px;font-weight:bold" name="" id="engaa" onkeypress="return /[0-9]/i.test(event.key)" class="" /-->
                                                <input type="number" style="height:20px;font-size:18px;font-weight:bold" id="engli" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="ruengaa" class="">
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                      
                                        <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">Kiswahili <span class="max"  id="maxki"></span></label>
                                                <input type="text" name="" style="height:20px;font-size:18px;font-weight:bold" id="kisaa" onkeypress="return /[0-9]/i.test(event.key), counttotal()" class="" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="rukisaa" class="">
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                        <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">CRE <span class="max"  id="maxcr"></span></label>
                                                <input type="text" name=""  style="height:20px;font-size:18px;font-weight:bold" onkeypress="return /[0-9]/i.test(event.key), counttotal()" id="biblee" class="" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="rubiblee" class="">
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                      
                                        <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">Creative Arts <span class="max" id="maxca"></span></label>
                                                <input type="text" name="" style="height:20px;font-size:18px;font-weight:bold" id="creaa" onkeypress="return /[0-9]/i.test(event.key), counttotal()" class="" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="rucreaa" class="" >
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                      
                                      
                                        <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">Social Studies<span class="max"  id="maxea"></span></label>
                                                <input type="text" name="" style="height:20px;font-size:18px;font-weight:bold" onkeypress="return /[0-9]/i.test(event.key), counttotal()" id="Soci" class="" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="rusoci" class="" >
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                      
                                        <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">Science & Technology<span class="max"  id="maxea"></span></label>
                                                <input type="text" name="" style="height:20px;font-size:18px;font-weight:bold" onkeypress="return /[0-9]/i.test(event.key), counttotal()" id="ste" class="" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="ruste" class="" >
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                      
                                      
                                       <tr>
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">Agriculture & Nutrition<span class="max"  id="maxea"></span></label>
                                                <input type="text" name="" style="height:20px;font-size:18px;font-weight:bold" onkeypress="return /[0-9]/i.test(event.key), counttotal()" id="agi" class="" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="ruagi" class="" >
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr>
                                      
                                   
                                       <tr style="background-color:#d1e0e0">
                                          <td>
                                                <div class="form-group">
                                                <label for="inputStatus">Overall Performance </label>
                                                <input type="text" name="" disabled  id="OPP" class="" />
                                                </div>
                                           </td>
                                          <td>
                                               <div class="form-group">
                                                <label for="inputStatus">Rubric</label>
                                                <select id="ruOPP" class="" required>
                                                <option value="">Rub---</option>
                                                <option value="EE">EE</option>
                                                <option value="ME">ME</option>
                                                <option value="AE">AE</option>
                                                <option value="BE">BE</option>
                                                </select>
                                               </div>
                                          </td>
                                      </tr-->
                                      
                                      <tr>
                                          <input type="hidden" id="upper1id" />
                                          <td colspan="2"><button class="btn btn-success btn-sm pull-right" id="saveupper1">Save</button></td>
                                      </tr>
                                  </table>  
                                </div>
                        </div>
                  </form>
                  <center><label id="savemessage"></label></center>
                </div>
              </div>  
        
            </div>
            </div>
          </div>
          <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
      </div>
      
      
      