function callCoposurvey() {
  $("#page_main_div").load("../html_modules/coposurvey.html?v=1", function () {
    document.getElementById("display_module_name").innerHTML = "CO/PO Survey";
    document.getElementById("module_name_for_save").value = "CO/PO Survey";
    getDefaultHeadFooterLinks("CO/PO Survey");
  });
  subjectTable();
}
function clearcoposurvey() {
  callCoposurvey();
}
let arr = [];
function subjectTable() {
  $.blockUI({
    message:
      "<h1 class='h1' style='font-size:12px'><img src='img/ajax-loader.gif' border='0'></h1>",
  });
  $.ajax({
    type: "GET",
    url: $host_url + "entercopomarkssubjectwise",
    success: function (res) {
      let responce = JSON.parse(res);
      arr = responce.data;
      if (responce.error_code == 0) {
        var table = `<table align="center" width="100%" cellspacing="3" cellpadding="5" border="1" style="position: sticky; top: 1; z-index: 0;border-radius:5px;">`;

        table += `<tr class="ui-state-default ui-jqgrid-hdiv" style="position: sticky; top: 0;">
          <th style="vertical-align:middle;width:5%;">Sl. No.</th>
          <th style="vertical-align:middle;width:7%;">SubCode</th>
          <th style="vertical-align:middle;width:8%;">Course Code</th>
          <th style="vertical-align:middle;width:20%;">Subject</th>
          <th style="vertical-align:middle;width:5%;">CO1</th>
          <th style="vertical-align:middle;width:5%;">CO2</th>
          <th style="vertical-align:middle;width:5%;">CO3</th>
          <th style="vertical-align:middle;width:5%;">CO4</th>
          <th style="vertical-align:middle;width:5%;">CO5</th>
          <th style="vertical-align:middle;width:5%;">CO6</th>
        </tr>`;

        for (var i = 0; i < responce.data.length; i++) {
          table += `<tr class="ui-widget-content jqgrow">
            <td class="tbl_row_new" style="border-left:1px solid #C5DBEC; border-right:1px solid #C5DBEC; padding:2px; font-size:12px;text-align:center;">${
              i + 1
            }</td>
            <td class="tbl_row_new" style="border-left:1px solid #C5DBEC; border-right:1px solid #C5DBEC; padding:2px; font-size:12px;text-align:center;">${
              responce.data[i].fsubcode
            }</td>
            <td class="tbl_row_new" style="border-left:1px solid #C5DBEC; border-right:1px solid #C5DBEC; padding:2px; font-size:12px;text-align:center;">${
              responce.data[i].fsubshort
            }</td>
            <td class="tbl_row_new" style="border-left:1px solid #C5DBEC; border-right:1px solid #C5DBEC; padding:2px; font-size:12px;text-align:left;">${
              responce.data[i].fsubname
            }</td>
            <td style="text-align:center"><input style="width: 50px;" id="CO1${i}" value="${
            responce.data[i].CO1
          }" onblur="getCoValues('${i}', 'CO1')"/></td>
            <td style="text-align:center"><input style="width: 50px;" value="${
              responce.data[i].CO2
            }" id="CO2${i}" onblur="getCoValues('${i}', 'CO2')"/></td>
            <td style="text-align:center"><input style="width: 50px;" value="${
              responce.data[i].CO3
            }" id="CO3${i}" onblur="getCoValues('${i}', 'CO3')"/></td>
            <td style="text-align:center"><input style="width: 50px;" value="${
              responce.data[i].CO4
            }" id="CO4${i}" onblur="getCoValues('${i}', 'CO4')"/></td>
            <td style="text-align:center"><input style="width: 50px;" value="${
              responce.data[i].CO5
            }" id="CO5${i}" onblur="getCoValues('${i}', 'CO5')"/></td>
            <td style="text-align:center"><input style="width: 50px;" value="${
              responce.data[i].CO6
            }" id="CO6${i}" onblur="getCoValues('${i}', 'CO6')"/></td>
          </tr>`;
        }
        table += `</table>`;
        document.getElementById("copomarksentry").innerHTML = table;
        $.unblockUI();
      }
    },
  });
}

function getCoValues(i, id) {
  let co = $(`#${id + i}`).val();
  arr[i][id] = co;
  console.log(arr);
}
function savehandler() {
  let formdata = new FormData();
  let filteredArr = arr.filter(
    (item) =>
      item.CO1.trim() !== "" ||
      item.CO2.trim() !== "" ||
      item.CO3.trim() !== "" ||
      item.CO4.trim() !== "" ||
      item.CO5.trim() !== "" ||
      item.CO6.trim() !== ""
  );
  formdata.append("data", JSON.stringify(filteredArr));

  $.ajax({
    type: "POST",
    url: $host_url + "postToStudCoPo",
    data: formdata,
    contentType: false,
    processData: false,
    cache: false,
    success: function (responce) {
      console.log(responce);
    },
  });
}