createnewmemo.js

// -----------------------------------------
// Transactin Crew Memo
// -----------------------------------------

const createnewMemoData = {
  crewprogrammemoId: '',
    crewprogrammemoNumber: '',
    showFocusId: '',
    showName: '',
    crewprogrammemoDescription: '',
    crewprogrammemoIsapproved: '',
    crewprogrammemoApprovedby: '',
    crewprogrammemoApproveddate: [],
    crewprogrammemoIsdisabled: '',
    crewprogrammemoDisabledby: '',
    crewprogrammemoDisableddate: [],
    crewprogrammemoCreatedby: '',
    crewprogrammemoCreateddate: [],
    crewprogrammemoModifiedby: '',
  crewprogrammemoModifieddate: [],
  tableplacement: [],
  tabledismissal: [],
}


function checkMemoData(){
  console.log(createnewMemoData)
}


// -----------------------------------------
// Placement
// -----------------------------------------

function showSomething(valueName){
  if(valueName == ""){
    return
  }
  // alert(valueName)

}

$('#progid').change(function(){
  alert('somehing change')
});

function checkData(){
  let programId = document.getElementById('progid').value
  // alert(programId)
  if(programId === ''){
    alert('input the program first')
  }
  else{
    $('#modalAddPlacement').modal("show")
  }
}


function clickRows(){
    var grid = document.getElementById('tblNikName')
    var checkBoxes = document.getElementsByClassName('placementTest')
    var tbody = document.getElementById('bodyPlacement')
    var counti = 0
    var laneValue = 10
    var newEntry, table = [];

    for (var i = 0; i < checkBoxes.length; i++) {
      if (checkBoxes[i].checked) {
        counti++
        newEntry = {
          memoId: '',
          placementLine: '',
          employeeNik:'',
          employeeName:'',
          crewPositions:'',
          btn:'',
          programID:'',
          programName:'',
        };
        newEntry.placementLine = laneValue
        newEntry.programID = document.getElementById('progid').value
        newEntry.programName = document.getElementById('progname').value
        newEntry.employeeNik = grid.rows[i+1].cells[1].innerHTML
        newEntry.employeeName = grid.rows[i+1].cells[2].innerHTML
        table.push(newEntry)
        createnewMemoData.tableplacement = table;
      }
      laneValue = laneValue + 10
    }
    checkMemoData()

    for(let i=0; i <counti; i++){
      var tread = document.createElement('tr')
      let keys = Object.keys(table[i]);
      for(let j=0; j<keys.length; j++){
        var t = document.createTextNode(table[i][keys[j]]);
        var tede = document.createElement('td')
        if(j===5){
          let button = document.createElement('button');
          button.setAttribute('id','coba')
          button.setAttribute('class', 'btn btn-primary');
          button.textContent = '...'
          tede.appendChild(button)
        }
        tede.appendChild(t)
        tread.appendChild(tede)
      }
      tbody.appendChild(tread)
    }
}

  $('#bodyPlacement').on('click','td', function(){
    let getIndexCol = $(this).index()
    let getIndexRow = $(this).parent('tr').index()
    if(getIndexCol === 5){
      valuePositionName(getIndexCol, getIndexRow)
      $('#modalAddPositions').modal()
    }
  });

  function valuePositionName(getIndexCol, getIndexRow){
    var positionName, tbl, tr, td;
    var tbody = document.getElementById('bodyPlacement')
    tbl = document.getElementById("tblPositions");
    for(var  i = 1; i< tbl.rows.length; i++){
      tbl.rows[i].onclick = function(){
        console.log(getIndexCol)
        console.log(getIndexRow)
        tbody.rows[getIndexRow].cells[getIndexCol-1].innerHTML = this.cells[1].innerHTML
        hideModal()
      }
    }
  }

  function filterEmployee() {
        var input, filter, table, tr, td, i, txtValue;
        input = document.getElementById("filterEmployee");
        filter = input.value.toUpperCase();
        table = document.getElementById("tblNikName");
        tr = table.getElementsByTagName("tr");
        for (i = 0; i < tr.length; i++) {
          td = tr[i].getElementsByTagName("td")[2];
          if (td) {
            txtValue = td.textContent || td.innerText;
            if (txtValue.toUpperCase().indexOf(filter) > -1) {
                tr[i].style.display = "";
            } else {
                tr[i].style.display = "none";
            }
        }
    }
  }

function hideModal(){
  $('#modalAddPositions').modal('hide');
}

// collapsible blade
function createDate() {
  $("#createDate").datepicker("show").on('change',function(){
      $('.datepicker').hide();
  });
}
function disabledDate() {
  $("#disabledDate").datepicker("show").on('change',function(){
      $('.datepicker').hide();
  });
}
function approvedDate() {
  $("#approvedDate").datepicker("show").on('change',function(){
      $('.datepicker').hide();
  });
}
function modifiedDate() {
  $("#modifiedDate").datepicker("show").on('change',function(){
      $('.datepicker').hide();
  });
}

// -----------------------------------------
// Dismissal
// -----------------------------------------

function checkDismissal(){
    // alert(programId)
    let programId = document.getElementById('progname').value
    if(programId === ''){
        alert('input the program first')
    }
    else{
        document.getElementById('inputdismissal').value = programId
        $('#modalAddDismissal').modal("show",function(){
        $('#inputdismissal').val(programId).trigger('change');
        $('#inputdismissal').change(function(){
                //fire your ajax call
            var value = $(this).val().toLowerCase();
            $("#myTable tr").filter(function() {
                $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
            });
        })
        })
    }
    }

    function clickRowsDismissal(){
        var grid = document.getElementById('tblDisNikName')
        var checkBoxes = document.getElementsByClassName('dismissalTest')
        var tbody = document.getElementById('bodyDismissal')
        var counti = 0
        var laneValue = 10
        var newEntry, table = [];

        for (var i = 0; i < checkBoxes.length; i++) {
          if (checkBoxes[i].checked) {
            counti++
            newEntry = {
              memoId: '',
              placementLine: '',
              employeeNik:'',
              employeeName:'',
              crewPositions:'',
            //   btn:'',
              programID:'',
              programName:'',
            };
            newEntry.placementLine = laneValue
            newEntry.programID = document.getElementById('progid').value
            newEntry.programName = document.getElementById('progname').value
            newEntry.employeeNik = grid.rows[i+1].cells[1].innerHTML
            newEntry.employeeName = grid.rows[i+1].cells[2].innerHTML
            newEntry.crewPositions = grid.rows[i+1].cells[3].innerHTML
            table.push(newEntry)
            createnewMemoData.tabledismissal = table
          }
          laneValue = laneValue + 10
        }
        checkMemoData(createnewMemoData)

        for(let i=0; i <counti; i++){
          var tread = document.createElement('tr')
          let keys = Object.keys(table[i]);
          for(let j=0; j<keys.length; j++){
            var t = document.createTextNode(table[i][keys[j]]);
            var tede = document.createElement('td')
            tede.appendChild(t)
            tread.appendChild(tede)
          }
          tbody.appendChild(tread)
        }
    }

// --------------------------
//Save And Edit Data
// --------------------------

function savedata(){

  createnewMemoData.crewprogrammemoId = document.getElementById('crewMemoId').value;
    createnewMemoData.crewprogrammemoNumber = document.getElementById('crewMemoMemo').value;
    createnewMemoData.showFocusId = document.getElementById('progid').value;
    createnewMemoData.showName = document.getElementById('progname').value;
    createnewMemoData.crewprogrammemoDescription= document.getElementById('descriptionsmemo').value;
    createnewMemoData.crewprogrammemoIsapproved= '';
    createnewMemoData.crewprogrammemoApprovedby= document.getElementById('approvedby').value;
    createnewMemoData.crewprogrammemoApproveddate = [];
    createnewMemoData.crewprogrammemoIsdisabled= '';
    createnewMemoData.crewprogrammemoDisabledby= document.getElementById('disabledby').value;
    createnewMemoData.crewprogrammemoDisableddate= [];
    createnewMemoData.crewprogrammemoCreatedby= document.getElementById('createdby').value ;
    createnewMemoData.crewprogrammemoCreateddate= [];
    createnewMemoData.crewprogrammemoModifiedby= document.getElementById('modifiedby').value;
  createnewMemoData.crewprogrammemoModifieddate= [];

  let dataNewMemoData = JSON.stringify(createnewMemoData);
  console.log(dataNewMemoData)


  $.ajax({
    url: '/crew_memo/submitdata',
    type: 'POST',
    contentType: 'json',
    data: JSON.stringify({createnewMemoData}),
    headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
    success : function(data){
      console.log(data) //this will be your html respone make sure you don't have any html or header or body tag inside your view file you want to render.
    },
    error : function(jqXHR,textStatus,thrownError){
      console.log(jqXHR) //for non 2xx or 3xx response code
    }
  })
}