      <div class="modal fade" id="edit-SAPForm<?= htmlentities($user_session); ?>">
          <div class="modal-dialog modal-sm">
              <div class="modal-content">
                  <div class="modal-header">
                      <h4 class="modal-title">Manage SAP Form</h4>
                      <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                          <span aria-hidden="true">&times;</span>
                      </button>
                  </div>
                  <div class="modal-body">
                      <form method="POST">
                        <div id="msg-sapformedit"></div>
                          <div class="form-group">
                              <label>SAP FORM #:</label>
                              <input type="text" id="edit_sapformno" alt="sapform_no2" class="form-control" oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*?)\..*/g, '$1');" autocomplete="off">
                          </div>
                          <div class="form-group">
                              <label>Beneficiaries Name:</label>
                             <select id="edit_beneficiariesid" alt="beneficiaries_id2" class="select2 form-control input-sm" style="width:100%">
                                    <option selected="" disabled="">&larr; Select Resident &rarr; </option>
                                    <?php
                                      include_once('../../config/conn/db-connection.php');
                                      $data = $db->query("SELECT * FROM  tbl_beneficiaries")->fetchAll();
                                        foreach ($data as $row) {
                                            echo '
                                                <option value="'.htmlentities($row['beneficiaries_id']).'">'.htmlentities($row['lastname']).', '.htmlentities($row['firstname']).' '.$row['middlename'].'</option>    
                                            ';
                                        }
                                    ?>
                                </select>
        
                          </div>
                          <div class="form-group">
                              <label>Purpose:</label>
                              <textarea type="text" rows="2" id="edit_purpose" alt="purpose2" class="form-control"  autocomplete="off"></textarea>
                          </div>
                          <div class="form-group">
                              <label>Financial Service Provider:</label>
                              <input type="text" id="edit_financialserviceprovider" alt="financial_serviceprovider2" class="form-control" autocomplete="off">
                          </div>
                     </div>
                  <div class="modal-footer justify-content-between">
                      <input type="hidden" id="edit_sapformid">
                      <input type="hidden" alt="user_edit" id="user_edit" value="<?= htmlentities($user_session); ?>">
                      <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
                      <button type="button" class="btn btn-primary" id="edit-SAP">Update</button>
                  </div>
               </form>
              </div>
          </div>
      </div>
           <script>
          document.addEventListener('DOMContentLoaded', () => {
              let btn = document.querySelector('#edit-SAP');
              btn.addEventListener('click', () => {

                  const sapform_no = document.querySelector('input[alt=sapform_no2]').value;
                  const beneficiaries_id = $('#edit_beneficiariesid option:selected').val();
                  const purpose = document.querySelector('textarea[alt=purpose2]').value;
                  const financial_serviceprovider = document.querySelector('input[alt=financial_serviceprovider2]').value;
                  const sapform_id = document.querySelector('input[id=edit_sapformid]').value;
                  const user = document.querySelector('input[alt=user_edit]').value;


                  var data = new FormData(this.form);

                  data.append('sapform_no', sapform_no);
                  data.append('beneficiaries_id', beneficiaries_id);
                  data.append('purpose', purpose);
                  data.append('financial_serviceprovider', financial_serviceprovider);
                  data.append('sapform_id', sapform_id);
                  data.append('user', user);

                      $.ajax({
                          url: '../../controllers/edit_sapform.php',
                          type: "POST",
                          data: data,
                          processData: false,
                          contentType: false,

                          async: false,
                          cache: false,

                          success: function(data) {
                              $('#msg-sapformedit').html(data);

                          },
                          error: function(data) {
                              console.log("Failed");
                          }
                      });
                 // }

              });
          });
      </script>