Codeigniter 4 Pass value of dropdown from view to controller

Question

I'm currently having a problem in passing the ID of the value on the dropdown menu from the AJAX to the controller. I need to get the sec id for the WHERE clause in my controller. I can't use a form tag because it's inside the form tag, so I'm considering using AJAX.

VIEW

<div class="form-group col-md-4">
   <div class="input-group">
      <select class="custom-select" name="sec_id" id="sec-id" required>
         <option selected>Choose...</option>
         <option value="7">TBA_07</option>
         <option value="8">TBA_08</option>
         <option value="9">TBA_09</option>
         <option value="10">TBA_10</option>
      </select>
      <div class="input-group-append">
         <button class="btn btn-primary" id="load-data" type="button">Enter</button>
      </div>
   </div>
</div>
<div class="card">
   <div class="card-body">
      <div class="table-responsive">
         <table class="table table-sm">
            <thead>
               <tr>
               <tr>
                  <th>Subject ID</th>
                  <th>Subject Name</th>
                  <th>No. of Credits</th>
                  <th>Section Name</th>
               </tr>
            </thead>
            <tbody id= "data_subj">
            </tbody>
         </table>
      </div>
   </div>
</div>

If I use a static value just like the sample below for the '$sec id,' it works. However, because I intend to use a dropdown menu, the value must be changed.

CONTROLLER

public function Get_Subj_Load(){

      $sec_id = 1; <-- GET THE SELECTED VALUE ON THE DROPDOWN
      $builder = $this->db->table("stud_admission as sa");
      $builder->select('su.sub_id, su.sub_name, su.sub_no_credit, se.sec_name, sa.sa_level');
      $builder->join('section as se', 'se.sec_id = sa.sec_id');
      $builder->join('subjects as su', 'su.sec_id = sa.sec_id');
      $builder->where('sa.sec_id', $sec_id);
      $data['subj'] = $builder->get()->getResultArray();

      return $this->response->setJSON($data);

    }

AJAX

$(document).ready(function(){
  $("#load-data").click(function(){
    $('#data_subj').html("");
      loadsubj();
  });
});

function loadsubj()
{

  var sec_id=$("#sec-id").val();

  $.ajax({
    method:"GET",
    url: "<?php echo site_url(); ?>/Get-Subject-Load",
    data:{sec_id:sec_id},
    success: function(response){
      $.each(response.subj, function(key, value){

        $('#data_subj').append('<tr>\
          <td>'+value["sub_id"]+'</td>\
          <td>'+value["sub_name"]+'</td>\
          <td>'+value["sub_no_credit"]+'</td>\
          <td>'+value["sec_name"]+'</td>\
          </tr>');
      });
    }
  });
}