@extends('layouts.app')
@section('css')
<style>
  .m-portlet__head-text{
display: table-cell;
vertical-align: middle;
font-size: 1.3rem;
font-weight: 500;
font-family: Roboto;
}
.m-form .m-form__section.m-form__section--first, .m-form .m-form__section:first-child {
margin-top: 40px!important;
}
.m-form.m-form--group-seperator-dashed .m-form__group {
border-bottom: 0px!important;
}
.form-control{
border: 1px solid #E6E7E8!important;
overflow: hidden!important;
border-radius: .40rem!important;
font-family: sans-serif,Arial!important; 
color: #575962!important;  
font-size: 1rem!important;
line-height: 1.25!important;
background-color: #fff!important;
}
.m-form .m-form__heading .m-form__heading-title {
color: #716aca;
font-weight: 500;
font-size: 1.3rem;
}
.form-control:focus,.form-control:active{
 border-color: #3273dc!important;
 box-shadow: 0 0 0 0.125em rgba(50, 115, 220, 0.25)!important;
 }
.placeitrighthandside{
text-align: right;
}
.hidethis{
display:none;
}
  
   .tablebutton{
   font-family:'Myriad Pro';
   font-weight: normal;   
   font-size: 15px;
   }
   .btn-special{
   font-size: 24px;
   color:white;
   background-color: white;
   border: 0px solid white; 
   }
 
.col-lg-1.tablevisibility,
.col-lg-10.tablevisibility{
border: 2px solid #BCBEC0; 
border-collapse: collapse;  
}
   #rowmuatnaik2,
   #rowpadam2,
   #rowinputdokumenicon{
   padding-bottom: 4px; 
   padding-top: 8px;     
   }
   .labelwarning{
   color: red!important;
   font-size: 13px!important;
   font-family:'Myriad Pro'!important;
   font-weight: normal!important;  
   }
   /*Tooltip popup on mouse hover*/
   .tooltip {
   position: relative !important;
   display: inline-block !important;
   border-bottom: 0px dotted black;
   opacity:1 !important;
   }
   /* Position the tooltip */
   .tooltip .tooltiptext {
   visibility: hidden!important;
   width:700%!important;
   margin-left: -60px!important;
   background-color: #eee!important;
   color: black!important;
   text-align: left!important;
   border-radius: 0px!important;
   border-color: #E6E7E8!important;
   padding: 0px 0px!important;
   opacity: 1!important;;
   transition: opacity 1s!important;
   border-top-width: 0px!important;
   border-top-style: solid!important;
   border-bottom-width: 0px!important;
   border-bottom-style: solid!important;
   border-right-width: 0px!important;
   border-right-style: solid!important;
   border-left-width: 0px!important;
   border-left-style: solid!important;
   position: absolute!important;
   z-index: 1!important;
   top: -557px!important;
   }
   .tooltip:hover .tooltiptext {
   visibility: visible!important;
   opacity: 1!important;
   }
   /* tooltip arrow position*/
   .tooltip .tooltiptext::after {
   content: ""!important;
   position: absolute!important;
   top: 101%!important;
   right: 91.8%!important;
   margin-top: -5px!important;
   border-width: 13px!important;
   border-style: solid!important;
   border-color: black transparent transparent transparent!important;
   }
   h5{
   background-image: url("Information-icon2.png")!important;
   background-repeat: no-repeat!important;
   background-position: right!important;
   padding-right: 40px!important;
   margin-bottom: 5px !important;
   display: inline-block!important;
   }
   th {
   border: 2px solid #BCBEC0!important;
   border-collapse: collapse!important;
   background-color: #414042;
   color: white;
   padding: 10px;
   font-family:'Myriad Pro';
   font-weight: normal;
   margin-top: 15px;
   margin-bottom: 15px;
   font-size: 16px;
   }
   #tool {
   border: 2px solid #BCBEC0; 
   border-collapse: collapse;
   text-align: left;
   font-family:'Myriad Pro';
   font-weight: normal;
   padding: 5px !important;
   background-color: white;
   margin-top: 5px;
   margin-bottom: 5px;
   }
</style>
@endsection
@section('content')
<form class="m-form m-form--fit m-form--label-align-right m-form--group-seperator-dashed">
   <div class="m-content">
      <div class="row">
         <div class="col-lg-12">
            <!--begin::Portlet-->
            <div id="cardasuhpintar" class="m-portlet">
               <div class="m-portlet__head" >
                  <div class="m-portlet__head-caption">
                     <div class="m-portlet__head-title">
                        <span class="m-portlet__head-icon m--hide">
                        <i class="la la-gear"></i>
                        </span>
                        <h3 id="asuhpintar" class="m-portlet__head-text"  >
                           ASUH PINTAR
                        </h3>
                     </div>
                  </div>
               </div>
               <!--begin::Form-->
               <div class="m-portlet__body">
                  <div class="m-form__section m-form__section--first maklumatpemohon">
                     <div class="m-form__heading">
                        <h3 id="maklumatpemohon" class="m-form__heading-title">
                           Maklumat Pemohon:
                        </h3>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Nama:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="namapemohon" name="namapemohon" placeholder="Sila masukan nama">
                        </div>
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Agama:
                        </label>
                        <div class="col-lg-4">
                           <select id="agama" name="agama"  class="form-control m-input" onchange="getAgama($(this).val())" >
                              <option value="" hidden selected>Sila pilih agama</option>
                              <option value="Melayu">Melayu</option>
                              <option value="Cina">Cina</option>
                              <option value="India">India</option> 
                              <option value="Lain-Lain">Lain-Lain</option>
                           </select> <br/>
                           <input type="text" class="form-control m-input hidethis" id="agamalainlain" name="agamalainlain" placeholder="Sila masukan agama" >
                        </div>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>No.Kad Pengenalan / No.Polis / No.Tentera:
                        </label>
                        <div class="input-group m-input-group col-lg-4">
                           <select class="m-input" id="ic_type" name="ic_type" style="font-size: 13px; color: #575962; border-color: #ebedf2; background-color: #f4f5f8" onchange="getIc($(this).val())">
                              <option value="1">No. K/P</option>
                              <option value="2">No. Tentera</option>
                              <option value="3">No. Polis</option>
                           </select>
                           <input type="text" class="form-control m-input" id="nokadpengenalanpemohon" name="nokadpengenalanpemohon" placeholder="Sila masukan no kad pengenalan" value="" onblur="checkDuplicate($(this).val(),'ic')" data-inputmask-regex="([a-zA-Z0-9 ])+/g" maxlength="12">
                        </div>
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Bangsa:
                        </label>
                        <div class="col-lg-4">
                           <select class="form-control m-input" id="ddlbangsa" name="ddlbangsa" onchange="getBangsa($(this).val())">
                              <option value="" hidden selected>Sila pilih bangsa</option>
                              <option value="Melayu">Melayu</option>
                              <option value="Cina">Cina</option>
                              <option value="India">India</option> 
                              <option value="Lain-Lain">Lain-Lain</option>
                           </select> <br/>
                           <input type="text" class="form-control m-input hidethis" id="bangsalainlain" name="bangsalainlain" placeholder="Sila masukan bangsa" >
                        </div>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Jantina:
                        </label>
                        <div class="col-lg-4">
                           <div class="m-radio-list">
                              <label class="m-radio m-radio--solid m-radio--brand">
                              <input type="radio" name="inputlelakiperempuan" id="lelaki" value="lelaki">
                              Lelaki
                              <span></span>
                              </label>
                              <label class="m-radio m-radio--solid m-radio--brand">
                              <input type="radio" name="inputlelakiperempuan" id="perempuan" value="perempuan">
                              Perempuan
                              <span></span>
                              </label>
                           </div>
                        </div>
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Status Perkahwinan:
                        </label>
                        <div class="col-lg-4">
                           <select class="form-control m-input" id="statusperkahwinan" name="statusperkahwinan" onchange="getStatusperkahwinan($(this).val())">
                              <option value="" hidden selected>Sila pilih status perkahwinan</option>
                              <option value="Bujang">Bujang</option>
                              <option value="Berkahwin">Berkahwin</option>
                              <option value="Duda/Janda">Duda/Janda</option>
                           </select>
                        </div>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Emel:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="emelpemohon" name="emelpemohon" placeholder="Sila masukkan emel" onblur="checkEmail($(this))" >
                        </div>
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Pendapatan Bulanan:
                        </label>
                        <div class="input-group m-input-group col-lg-4">
                           <span class="input-group-addon">
                           RM
                           </span>
                           <input type="text" class="form-control m-input placeitrighthandside" id="pendapatanbulanan" name="pendapatanbulanan" value="" placeholder="Sila masukan pendapatan bulanan" oninput="total()">
                        </div>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Tarikh Lahir:
                        </label>
                        <div class="col-lg-4">
                           <input type="date" data-date="" id="tarikhlahirpemohon" name="tarikhlahirpemohon" class="form-control m-input" data-date-format="MM DD YYYY">
                        </div>
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>No Telefon Bimbit:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="notelefonbimbitpemohon" name="notelefonbimbitpemohon" placeholder="Sila masukan no telefon bimbit">
                        </div>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Tempat Lahir:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="tempatlahir" name="tempatlahir" placeholder="Sila masukan tempat lahir">
                        </div>
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>No Telefon Rumah:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="notelefonrumah" name="notelefonrumah" placeholder="Sila masukan no telefon rumah">
                        </div>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Bilangan Tanggunggan:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="bilangantangunggan" name="bilangantangunggan" placeholder="Sila masukkan bilangan tangunggan">
                        </div>
                     </div>
                  </div>
                  <div class="m-form__seperator m-form__seperator--dashed maklumattempattinggal"></div>
                  <div class="m-form__section m-form__section--middle maklumattempattinggal">
                     <div class="m-form__heading">
                        <h3 id="maklumattempattinggal" class="m-form__heading-title">
                           Maklumat Tempat Tinggal:
                        </h3>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Alamat:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" name="alamat_1" placeholder="Sila masukan alamat">
                        </div>
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Poskod:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="poskod" name="poskod" placeholder="Sila masukan poskod">
                        </div>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" name="alamat_2" placeholder="Sila masukan alamat">
                        </div>
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Daerah:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" name="daerah" placeholder="Sila masukan daerah">
                        </div>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" name="alamat_3" placeholder="Sila masukan alamat">
                        </div>
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Negeri:
                        </label>
                        <div class="col-lg-4">
                           <select class="form-control m-input" id="negeri" name="negeri">
                              <option value="{{ old('') }}" hidden selected>Sila pilih negeri</option>
                              <option value="Johor">Johor</option>
                              <option value="Kedah">Kedah</option>
                              <option value="Kelantan">Kelantan</option>
                              <option value="Melaka">Melaka</option>
                              <option value="Negeri Sembilan">Negeri Sembilan</option>
                              <option value="Pahang">Pahang</option>
                              <option value="Penang">Penang</option>
                              <option value="Perak">Perak</option>
                              <option value="Perlis">Perlis</option>
                              <option value="Selangor">Selangor</option>
                              <option value="Terengganu">Terengganu</option>
                              <option value="Sabah">Sabah</option>
                              <option value="Sarawak">Sarawak</option>
                              <option value="W.P. Kuala Lumpur">W.P. Kuala Lumpur</option>
                              <option value="W.P. Labuan">W.P. Labuan</option>
                              <option value="W.P. Putrajaya">W.P. Putrajaya</option>
                           </select>
                        </div>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Bandar:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" name="bandar" placeholder="Sila masukan bandar">
                        </div>
                     </div>
                  </div>
                  <div class="m-form__seperator m-form__seperator--dashed maklumatpasangan"></div>
                  <div class="m-form__section m-form__section--middle maklumatpasangan hidethis">
                     <div class="m-form__heading">
                        <h3 id="maklumatpasangan" class="m-form__heading-title">
                           Maklumat Pasangan:
                        </h3>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Nama:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="namapasangan" name="namapasangan" placeholder="Sila masukan nama">
                        </div>
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Tarikh Lahir:
                        </label>
                        <div class="col-lg-4">
                           <input type="date" data-date="" id="tarikhlahirpasangan" name="tarikhlahirpasangan" class="form-control m-input" data-date-format="MM DD YYYY">
                        </div>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>No.Kad Pengenalan / No.Polis / No.Tentera:
                        </label>
                        <div class="input-group m-input-group col-lg-4">
                           <select class="m-input" id="ic_type" name="ic_type" style="font-size: 13px; color: #575962; border-color: #ebedf2; background-color: #f4f5f8" onchange="getIc($(this).val())">
                              <option value="1">No. K/P</option>
                              <option value="2">No. Tentera</option>
                              <option value="3">No. Polis</option>
                           </select>
                           <input type="text" class="form-control m-input" id="nokadpengenalanpasangan" name="nokadpengenalanpasangan" placeholder="Sila masukan no kad pengenalan" value="" onblur="checkDuplicate($(this).val(),'ic')" data-inputmask-regex="([a-zA-Z0-9 ])+/g" maxlength="12">
                        </div>
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Umur:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="umurpasangan" name="umurpasangan" placeholder="Sila masukan umur">
                        </div>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Emel:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="emelpasangan" name="emelpasangan" placeholder="Sila masukkan emel" onblur="checkEmail($(this))" >
                        </div>
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>No Telefon Bimbit:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="notelefonbimbitpasangan" name="notelefonbimbitpasangan" placeholder="Sila masukan no telefon bimbit">
                        </div>
                     </div>
                  </div>
                  <div class="m-form__seperator m-form__seperator--dashed maklumatpendapatanpemohon"></div>
                  <div class="m-form__section m-form__section--middle maklumatpendapatanpemohon">
                     <div class="m-form__heading">
                        <h3 id="maklumatpendapatanpemohon" class="m-form__heading-title">
                           Maklumat Pendapatan Pemohon:
                        </h3>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Pekerjaan:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="pekerjaanpemohon" name="pekerjaanpemohon" placeholder="Sila masukan pekerjaan">
                        </div>
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Jumlah Pendapatan:
                        </label>
                        <div class="input-group m-input-group col-lg-4">
                           <span class="input-group-addon">
                           RM
                           </span>
                           <input type="text" class="form-control m-input placeitrighthandside" id="jumlahpendapatanpemohon" name="jumlahpendapatanpemohon" placeholder="Sila masukan pendapatan bulanan" oninput="total()">
                        </div>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>No Telefon Majikan:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="notelefonmajikanpemohon" name="notelefonmajikanpemohon" placeholder="Sila masukan no telefon majikan">
                        </div>
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Alamat Pejabat:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="alamatpejabatpemohon" name="alamatpejabatpemohon" placeholder="Sila masukan alamat pejabat">
                        </div>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Poskod:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="poskodpekerjaanpemohon" name="poskodpekerjaanpemohon" placeholder="Sila masukan poskod">
                        </div>
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Negeri:
                        </label>
                        <div class="col-lg-4">
                           <select class="form-control m-input" id="negeripemohon" name="negeripemohon">
                              <option value="{{ old('') }}" hidden selected>Sila pilih negeri</option>
                              <option value="Johor">Johor</option>
                              <option value="Kedah">Kedah</option>
                              <option value="Kelantan">Kelantan</option>
                              <option value="Melaka">Melaka</option>
                              <option value="Negeri Sembilan">Negeri Sembilan</option>
                              <option value="Pahang">Pahang</option>
                              <option value="Penang">Penang</option>
                              <option value="Perak">Perak</option>
                              <option value="Perlis">Perlis</option>
                              <option value="Selangor">Selangor</option>
                              <option value="Terengganu">Terengganu</option>
                              <option value="Sabah">Sabah</option>
                              <option value="Sarawak">Sarawak</option>
                              <option value="W.P. Kuala Lumpur">W.P. Kuala Lumpur</option>
                              <option value="W.P. Labuan">W.P. Labuan</option>
                              <option value="W.P. Putrajaya">W.P. Putrajaya</option>
                           </select>
                        </div>
                     </div>
                  </div>
                  <div class="m-form__seperator m-form__seperator--dashed maklumatpendapatanpasangan"></div>
                  <div class="m-form__section m-form__section--middle maklumatpendapatanpasangan hidethis">
                     <div class="m-form__heading">
                        <h3 id="maklumatpendapatanpasangan" class="m-form__heading-title">
                           Maklumat Pendapatan Pasangan:
                        </h3>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Pekerjaan:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="pekerjaanpasangan" name="pekerjaanpasangan" placeholder="Sila masukan pekerjaan">
                        </div>
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Jumlah Pendapatan:
                        </label>
                        <div class="input-group m-input-group col-lg-4">
                           <span class="input-group-addon">
                           RM
                           </span>
                           <input type="text" class="form-control m-input placeitrighthandside" id="jumlahpendapatanpasangan" name="jumlahpendapatanpasangan" placeholder="Sila masukan pendapatan bulanan" oninput="total()">
                        </div>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>No Telefon Majikan:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="notelefonmajikanpasangan" name="notelefonmajikanpasangan" placeholder="Sila masukan no telefon majikan">
                        </div>
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Alamat Pejabat:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="alamatpejabatpasangan" name="alamatpejabatpasangan" placeholder="Sila masukan alamat pejabat">
                        </div>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Poskod:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="poskodpekerjaanpasangan" name="poskodpekerjaanpasangan" placeholder="Sila masukan poskod">
                        </div>
                        <label class="col-lg-2 col-form-label">
                        <span style="color: red">* </span>Negeri:
                        </label>
                        <div class="col-lg-4">
                           <select class="form-control m-input" id="negeripasangan" name="negeripasangan">
                              <option value="{{ old('') }}" hidden selected>Sila pilih negeri</option>
                              <option value="Johor">Johor</option>
                              <option value="Kedah">Kedah</option>
                              <option value="Kelantan">Kelantan</option>
                              <option value="Melaka">Melaka</option>
                              <option value="Negeri Sembilan">Negeri Sembilan</option>
                              <option value="Pahang">Pahang</option>
                              <option value="Penang">Penang</option>
                              <option value="Perak">Perak</option>
                              <option value="Perlis">Perlis</option>
                              <option value="Selangor">Selangor</option>
                              <option value="Terengganu">Terengganu</option>
                              <option value="Sabah">Sabah</option>
                              <option value="Sarawak">Sarawak</option>
                              <option value="W.P. Kuala Lumpur">W.P. Kuala Lumpur</option>
                              <option value="W.P. Labuan">W.P. Labuan</option>
                              <option value="W.P. Putrajaya">W.P. Putrajaya</option>
                           </select>
                        </div>
                     </div>
                  </div>
                  <div class="m-form__seperator m-form__seperator--dashed maklumatanakpemohon"></div>
                  <div class="m-form__section m-form__section--middle maklumatanakpemohon hidethis">
                     <div class="m-form__heading">
                        <h3 id="maklumatanakpemohon" class="m-form__heading-title">
                           Maklumat Anak Pemohon:
                        </h3>
                     </div>
                     <div class="form-group m-form__group row">
                     <div class="col-lg-12">
                     <table id="maklumatanakpemohontable" class="table order table-responsive">
                           <thead >
                              <tr>
                                 <td class="col-lg-3" id="namapenuh">Nama Penuh</td>
                                 <td class="col-lg-2" id="nomykid">No MyKID</td>
                                 <td class="col-lg-1" id="umur">Umur</td>
                                 <td class="col-lg-4" id="taska" >Taska</td>
                                 <td class="col-lg-1" id="yuran">Yuran(RM)</td>
                                 <td class="col-lg-2" id="sesiakhir"> <input type="button" id="padammaklumatanakpemohon" value="padam" class="btn-special" disabled></td>
                              </tr>
                           </thead>
                           <tbody>
                           </tbody>
                           <tfoot>
                              <tr>
                                 <td>
                                    <div id="tambahmaklumatanakpemohon" class="btn btn btn-sm btn-success m-btn m-btn--icon m-btn--pill m-btn--wide"><span><i class="la la-plus"></i><span id="tambahmaklumatpemohonrow" name="tambahmaklumatpemohonrow" class="tablebutton">Tambah</span></span></div>
                                 </td>
                              </tr>
                           </tfoot>
                        </table>
                        </div>
                     </div>
                  </div>
                  <div class="m-form__seperator m-form__seperator--dashed lampirandokumen"></div>
                  <div class="m-form__section m-form__section--last lampirandokumen">
                     <div class="m-form__heading">
                        <h3  id="lampirandokumen" class="m-form__heading-title">
                           LAMPIRAN DOKUMEN:
                        </h3>
                     </div>
                     <div class="form-group m-form__group row">
                     <div class="col-lg-12">
                        <table id="lampirandokumentunastable" class="table order" >
                           <thead >
                              <tr>
                                 <td class="col-lg-10 tablevisibility" id="rowinputdokumenicon">
                                    <div id="popup" class="tooltip">
                                       <h5 class="abc">Dokumen</h5>
                                       <span class="tooltiptext">
                                          <table id="doclist" class="table-responsive" >
                                             <tr>
                                                <th>SENARAI SEMAK DOKUMEN</th>
                                             </tr>
                                             <tr >
                                                <td>
                                                   <table id="doctable" class="table-responsive" >
                                                      <col width="20">
                                                      <col width="940">
                                                      <col width="230">
                                                      <tr>
                                                         <td id="tool" ><b>No.</b></td>
                                                         <td id="tool"><b>Dokumen</b></td>
                                                         <td id="tool"><b>Butiran</b></td>
                                                      </tr>
                                                      <tr>
                                                         <td id="tool">1.</td>
                                                         <td id="tool">Salinan Borang Permohonan Skim Ceria</td>
                                                         <td id="tool"></td>
                                                      </tr>
                                                      <tr>
                                                         <td id="tool">2. </td>
                                                         <td id="tool">Laporan Kerosakan Bergambar</td>
                                                         <td id="tool"></td>
                                                      </tr>
                                                      <tr>
                                                         <td id="tool">3.</td>
                                                         <td id="tool">Pelan Susunatur Kawasan Pemajuan (jika ada)</td>
                                                         <td id="tool"></td>
                                                      </tr>
                                                      <tr>
                                                         <td id="tool">4.</td>
                                                         <td id="tool">Salinan Sijil JMB/MC atau Surat Lantikan</td>
                                                         <td id="tool"></td>
                                                      </tr>
                                                      <tr>
                                                         <td id="tool">5.</td>
                                                         <td id="tool">Salinan Perjanjian Jual Beli yang Pertama (Beli dengan Pemaju) yang telah di cop sah oleh COB, PBT</td>
                                                         <td id="tool"></td>
                                                      </tr>
                                                      <tr>
                                                         <td id="tool">6.</td>
                                                         <td id="tool">Laporan Pengurusan Kewangan JMB/MC 3 Bulan Terkini</td>
                                                         <td id="tool"></td>
                                                      </tr>
                                                   </table>
                                                </td>
                                             </tr>
                                          </table>
                                       </span>
                                    </div>
                                 </td>
                                 <td class="col-lg-1 tablevisibility" id="rowmuatnaik2" ></td>
                                 <td class="col-lg-1 tablevisibility" id="rowpadam2" ><label class="labelwarning" id="ldrowCount"></label></td>
                              </tr>
                           </thead>
                           <tbody id="ldbodyrow">
                              <tr>
                                 <td class="col-lg-10 tablevisibility" id="rowinputdokumen">
                                    <input type="file" id="real-file" hidden="hidden" />
                                    <select id="ddlmaklumat" class="form-control m-input" >
                                    <option value="" hidden selected>Sila Pilih</option>
                                       <option value="Salinan Borang Permohonan Skim Ceria">Salinan Borang Permohonan Skim Ceria</option>
                                       <option value="Laporan Kerosakan Bergambar">Laporan Kerosakan Bergambar</option>
                                       <option value="Pelan Susunatur Kawasan Pemajuan (jika ada)">Pelan Susunatur Kawasan Pemajuan (jika ada)</option>
                                       <option value="Salinan Sijil JMB/MC atau Surat Lantikan">Salinan Sijil JMB/MC atau Surat Lantikan</option>
                                       <option value="Salinan Perjanjian Jual Beli yang Pertama (Beli dengan Pemaju) yang telah di cop sah oleh COB, PBT">Salinan Perjanjian Jual Beli yang Pertama (Beli dengan Pemaju) yang telah di cop sah oleh COB, PBT</option>
                                       <option value="Laporan Pengurusan Kewangan JMB/MC 3 Bulan Terkini">Laporan Pengurusan Kewangan JMB/MC 3 Bulan Terkini</option>
                                    </select>
                                 </td>
                                 </select></td>
                                 <td class="col-lg-1 tablevisibility" id="rowmuatnaik"><button  id="muatnaiklampirandokumen" name="muatnaiklampirandokumen" type="submit" class="btn blue start" style="background-color:#2a9df4"><i class="fa fa-upload"></i> <span> Muat Naik </span></button></td>
                                 <td class="col-lg-1 tablevisibility" id="rowpadamlampirandokumen" name="rowpadamlampirandokumen" ><div id="padamlampirandokumen" name="padamlampirandokumen" class="btn-sm btn btn-warning m-btn m-btn--icon m-btn--pill"><span><i class="la la-trash-o"></i><span id="padamlampirandokumen" name="padamlampirandokumen" class="tablebutton">Padam</span></span></div></td>
                              </tr>
                           </tbody>
                           <tfoot>
                              <tr>
                                 <td>
                                    <div id="addrowlampirandokumen" class="btn btn btn-sm btn-success m-btn m-btn--icon m-btn--pill m-btn--wide"><span><i class="la la-plus"></i><span id="tambahlampirandokumen" name="tambahlampirandokumen" class="tablebutton" >Tambah</span></span></div>
                                 </td>
                              </tr>
                           </tfoot>
                        </table>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
         </div>
      </div>
   </div>
</form>
@endsection
@section('js')
<script src="../../../assets/vendors/base/vendors.bundle.js" type="text/javascript"></script>
<script src="../../../assets/demo/default/base/scripts.bundle.js" type="text/javascript"></script>
<script>

   $(document).ready(function(){
           $('#statusperkahwinan').on('change', function() {
             if ( this.value == 'Berkahwin')
             {
               $(".maklumatpasangan, .maklumatanakpemohon, .maklumatpendapatanpasangan").show('slow'); 
               $("#maklumatpasangantable tbody tr, #maklumatpasangantable thead tr, #maklumatpasangantable").show();
             
             }
             else if  (this.value == 'Duda/Janda') 
             {
               $(".maklumatpasangan").hide('slow');
               $('#ldbodyrow tr:gt(0)').remove();
               $('#inputnamapenuh, #inputnokadpengenalan, #inputumur, #tahapkesihatan').val('');

               $(".maklumatanakpemohon").show('slow');
               $('#inputnamapenuh,#nokp/sijilkelahiran,#inputumur,#inputhubungan,#tarafpendidikan,#inputpendapatanbulananjikaada').val('');

               $(".maklumatpendapatanpasangan").hide('slow'); 
               $('#jenispekerjaanpasangan,#pekerjaanpasangan,#jenisperniagaapperusahaanpasangan,#jumlahpendapatanpasangan,#namamajikanpasangan,#notelefonmajikanpasangan').val('');

               $("#maklumatpasangantable thead tr").hide();
               $('#maklumatpasangantable').hide();      
             }
             else 
             {
               $(".maklumatpasangan").hide('slow');
               $('#ldbodyrow tr:gt(0)').remove();
               $('#inputnamapenuh, #inputnokadpengenalan, #inputumur, #tahapkesihatan').val('');

               $(".maklumatanakpemohon").hide('slow');
               $('#ldbodyrow2 tr:gt(0)').remove();
               $('#inputnamapenuh,#nokp/sijilkelahiran,#inputumur,#inputhubungan,#tarafpendidikan,#inputpendapatanbulananjikaada').val('');

               $(".maklumatpendapatanpasangan").hide('slow'); 
               $('#jenispekerjaanpasangan,#pekerjaanpasangan,#jenisperniagaapperusahaanpasangan,#jumlahpendapatanpasangan,#namamajikanpasangan,#notelefonmajikanpasangan').val('');

              

               $("#maklumatpasangantable thead tr").hide();
               $('#maklumatpasangantable').hide();
             }
            
           });
       });
       
       function getStatus(x) {
                if(x == 'Berkahwin') 
                {
                    $('.maklumat_pasangan, .maklumat_pendapatan_pasangan, .maklumat_anak_pemohon').show('slow');

                    $('#pasangan_ic, #pasangan_nama, #pasangan_emel, #pasangan_no_tel, #pasangan_pendapatan').attr('disabled', false);

                } 
                else if(x == 'Duda/Janda') 
                {
                    $('.maklumat_anak_pemohon').show('slow');
                    $('.maklumat_pasangan, .maklumat_pendapatan_pasangan').hide('slow');

                    $('#pasangan_input tr:gt(0)').remove();
                    $('#pasangan_ic, #pasangan_nama, #pasangan_emel, #pasangan_no_tel, #pasangan_pendapatan').val('');
                    $('#pasangan_ic, #pasangan_nama, #pasangan_emel, #pasangan_no_tel, #pasangan_pendapatan').attr('disabled', true);
                  
                }
                else
                {
                  $('.maklumat_pasangan, .maklumat_pendapatan_pasangan, .maklumat_anak_pemohon').hide('slow');

                    $('#pasangan_input tr:gt(0)').remove();
                    $('#pasangan_ic, #pasangan_nama, #pasangan_emel, #pasangan_no_tel, #pasangan_pendapatan').val('');
                    $('#pasangan_ic, #pasangan_nama, #pasangan_emel, #pasangan_no_tel, #pasangan_pendapatan').attr('disabled', true);
                    $('#anak_input tr').detach();
                }
            }
            $(document).ready(function(){
             $('#agama').on('change', function() {
               if ( this.value == 'Lain-Lain')
               {
                 $("#agamalainlain").show('slow');     
               }
               else
               {
                 $("#agamalainlain").hide('slow');
                 $("#agamalainlain").val('');
               }
             });
         });
         $(document).ready(function(){
             $('#bangsa').on('change', function() {
               if ( this.value == 'Lain-Lain')
               {
                 $("#bangsalainlain").show('slow');     
               }
               else
               {
                 $("#bangsalainlain").hide('slow');
                 $("#bangsalainlain").hide('slow');
                 $("#bangsalainlain").val('');
                  document.getElementById('labelwarningtextL').innerHTML = '';
               }
             });
         });
    
       $("#inputnamapasangan").inputmask("Regex",{ regex: "[a-zA-Z]*"});
         
       $("#nokadpengenalanpasangan,#nokadpengenalanpemohon").inputmask({mask: "999999999999", placeholder: ""});
     
       $('#notelefonbimbitpemohon,#notelefonmajikanpemohon,#notelefonmajikanpasangan,#notelefonbimbitpasangan').inputmask('Regex', { regex: "^(01)[0-9]{8,9}$"});

       $('#notelefonrumah').inputmask('Regex', { regex: "^(03)[0-9]{8}$"});
     
       $("#bilangantangunggan").inputmask({mask: "99",placeholder: ""});
     
       $("#umurpasangan,#inputumur").inputmask({mask: "9999", placeholder: ""});
   
       $("#pendapatanbulanan,#jumlahpendapatanpemohon,#jumlahpendapatanpasangan").inputmask({mask: "9999999",placeholder: ""});
   
       $("#poskodpekerjaanpemohon,#poskodpekerjaanpasangan,#poskod").inputmask({mask: "99999", placeholder: ""});
   
       function checkEmail(x) {
       var email_format = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
   
           x.next().remove();
               
           if(x.val().match(email_format)) {
                   x.next().remove();
               } else if(x.val() == '') {
                   x.next().remove();
               } else {
                   x.after("<small style='color: #f4516c'>Sila masukkan format emel yang betul.</small>");
                   x.focus();
               }
           }
           
       $("#inputpekerjaanpasangan").inputmask("Regex",{ regex: "[a-zA-Z0-9]*"});
   
       $(document).ready(function(){
         $("#inputalamatpejabatpemohon").on('input',function () {
           var pekerjaanpemohon = $("#inputalamatpejabatpemohon").val();
           
       
            if(pekerjaanpemohon.length == 0)
            {
               $(this).css("box-shadow", "0 0 0 .2rem rgb(247, 14, 14)!important");
               $(this).css({background:'url("Warning Icon.png") right no-repeat'});
               document.getElementById('labelwarningalamatpejabatpemohon').innerHTML = 'Sila nyatakan alamat pejabat pemohon.';
           } 
           else
           {
               $(this).css({background:'url("")'});
               document.getElementById('labelwarningalamatpejabatpemohon').innerHTML = '';
           }
         });
       });
   
      
       $(document).ready(function(){
         $("#inputalamatpejabatpasangan").on('input',function () {
           var pekerjaanpemohon = $("#inputalamatpejabatpasangan").val();
           
       
            if(pekerjaanpemohon.length == 0)
            {
             $(this).css("box-shadow", "0 0 0 .2rem rgb(247, 14, 14)!important");
               $(this).css({background:'url("Warning Icon.png") right no-repeat'});
               document.getElementById('labelwarningalamatpejabatpasangan').innerHTML = 'Sila nyatakan alamat pejabat pemohon.';
           } 
           else
           {
               $(this).css({background:'url("")'});
               document.getElementById('labelwarningalamatpejabatpasangan').innerHTML = '';
           }
         });
       });
      
     
       $(document).ready(function () {
           var counter = 0;
       
           $("#tambahmaklumatanakpemohon").on("click", function () {
               var newRow = $("<tr>");
               var cols = "";
               cols += '<td id="rowinputnamapenuh"><input id="inputnamapenuh" name="inputnamapenuh[]" type="text" class="form-control m-input" name="inputnamapenuh' + counter + '"/></td>';
               cols += '<td id="rowinputnomykid><input id="inputnomykid" name="inputnomykid[]" type="text" class="form-control m-input" name="inputnomykid' + counter + '"/></td>';
               cols += '<td id="rowinputumur"><input id="inputumur" name="inputumur[]" type="text" class="form-control m-input" name="inputumur' + counter + '"/></td>';
               cols += '<td id="rowinputtaska"><input id="inputtaska" name="inputtaska[]" type="text" class="form-control m-input" name="inputtaska' + counter + '"/></td>';
               cols += '<td id="rowinputyuran"><input id="inputyuran" name="inputyuran[]" type="text" class="form-control m-input" name="inputyuran' + counter + '"/></td>';
               cols += '<td id="rowpadammaklumatanakpemohon"><div id="padammaklumatanakpemohon" class="btn-sm btn btn-warning m-btn m-btn--icon m-btn--pill"><span><i class="la la-trash-o"></i><span id="padammaklumatpemohonrow" name="padammaklumatpemohonrow" class="tablebutton">Padam</span></span></div></td>';
               newRow.append(cols);
               $("#maklumatanakpemohontable").append(newRow);
               counter++;
           });
       });
   
       $(document).ready(function () {
          
           $("#maklumatanakpemohontable").on("click", "#padammaklumatanakpemohon", function (event) {
   
               $(this).closest("tr").remove();       
           });
           
       });
   
       $(document).ready(function () {
           var counter = 0;
   
           $("#addrowlampirandokumen").on("click", function () {
               var newRow = $("<tr>");
               var cols = "";
   
       
                 cols += '<td  id="rowinputdokumen" class="col-lg-10 tablevisibility"><input type="file" id="real-file" hidden="hidden" />'+
                         '<select id="ddlmaklumat" class="form-control m-input dropdownlist"  >'+ 
                         '<option value="" hidden selected>Sila Pilih</option>'+                            
                         '<option value="Cetak Borang Permohonan">Cetak Borang Permohonan</option>'+   
                         '<option value="Salinan Sijil Lahir / Mykid Anak">Salinan Sijil Lahir / Mykid Anak</option>'+                 
                         '<option value="Salinan MyKad Ibu">Salinan MyKad Ibu</option>'+   
                         '<option value="Salinan MyKad Bapa">Salinan MyKad Bapa</option>'+   
                         '<option value="Salinan Perakuan Anak Angkat / Sijil Kematian / Sijil Cerai">Salinan Perakuan Anak Angkat / Sijil Kematian / Sijil Cerai</option>'+   
                         '<option value="Salinan Slip Gaji / Surat Akuan Pengesahan Pendapatan IBU">Salinan Slip Gaji / Surat Akuan Pengesahan Pendapatan IBU</option> '+  
                         '<option value="Salinan Slip Gaji / Surat Akuan Pengesahan Pendapatan BAPA">Salinan Slip Gaji / Surat Akuan Pengesahan Pendapatan BAPA</option>'+   
                         '<option value="Cop Pengesahan Tadika Tempat Anak Belajar">Cop Pengesahan Tadika Tempat Anak Belajar</option>'+
                         '<option value="Salinan Bil Air / Bil Elektrik / TM / ASTRO / Muka Depan Buku Merah IBU">Salinan Bil Air / Bil Elektrik / TM / ASTRO / Muka Depan Buku Merah IBU</option> '+  
                         '<option value="Cop Pengesahan Bermastautin">Cop Pengesahan Bermastautin</option></select></td>';
                 cols += '<td class="col-lg-1 tablevisibility" id="rowmuatnaik"><button  id="muatnaiklampirandokumen" name="muatnaiklampirandokumen" type="submit" class="btn blue start" style="background-color:#2a9df4"><i class="fa fa-upload"></i> <span> Muat Naik </span></button></td>';
                 cols += '<td class="col-lg-1 tablevisibility" id="rowpadamlampirandokumen"><div id="padamlampirandokumen"class="btn-sm btn btn-warning m-btn m-btn--icon m-btn--pill"><span><i class="la la-trash-o"></i><span id="padamlampirandokumen" name="padamlampirandokumen" class="tablebutton">Padam</span></span></div></td>';
               newRow.append(cols);
               $("#lampirandokumentunastable").append(newRow);
               counter++;
           });
       });
   
       $(document).ready(function () {
          
          $("#lampirandokumentunastable").on("click", "#padamlampirandokumen", function (event) {
   
   
            $(this).closest("tr").remove()
             
     
          });
          
      });
     
</script>
@endsection