@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;
   }
   .form-control:focus,
   .form-control:active{
   border-color: #3273dc!important;;
   box-shadow: 0 0 0 0.125em rgba(50, 115, 220, 0.25)!important;
   }
   .m-form .m-form__heading .m-form__heading-title {
                color: #716aca;
                font-weight: 500;
    font-size: 1.3rem;
            }
   #alamatpenuh{
   resize: none;
   }
  
   .tablevisibility.col-lg-10,
   .tablevisibility.col-lg-1{
   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;
   width:700%;
   margin-left: -60px;
   background-color: #eee;
   color: black;
   text-align: left;
   border-radius: 0px;
   border-color: #E6E7E8;
   padding: 0px 0px;
   opacity: 1;
   transition: opacity 1s;
   border-top-width: 0px;
   border-top-style: solid;
   border-bottom-width: 0px;
   border-bottom-style: solid;
   border-right-width: 0px;
   border-right-style: solid;
   border-left-width: 0px;
   border-left-style: solid;
   position: absolute;
   z-index: 1;
   top: -557px;
   }
   .tooltip:hover .tooltiptext {
   visibility: visible;
   opacity: 1;
   }
   /* tooltip arrow position*/
   .tooltip .tooltiptext::after {
   content: "";
   position: absolute;
   top: 101%;
   right: 91.8%;
   margin-top: -5px;
   border-width: 13px;
   border-style: solid;
   border-color: black transparent transparent transparent;
   }
   h5{
   background-image: url("Information-icon2.png");
   background-repeat: no-repeat;
   background-position: right;
   padding-right: 40px;
   margin-bottom: 5px !important;
   display: inline-block;
   }
   th {
   border: 2px solid #BCBEC0; 
   border-collapse: collapse;
   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">
         <div id="cardskimceria" name="cardskimceria" 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="skimceria" name="skimceria" class="m-portlet__head-text"  >
                        Skim Ceria
                     </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" name="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 Pangsapuri:
                     </label>
                     <div class="col-lg-4">
                        <input type="text" class="form-control m-input" id="namapangsapuri" name="namapenuhpemohon" placeholder="Sila masukan nama pangsapuri">
                     </div>
                     <label class="col-lg-2 col-form-label">
                     <span style="color: red">* </span>Kategori Rumah:<br/>
                     (Rujuk Surat Perjanjian Jual Eli S&P Tahun Pertama Diduduki/pembelian Dengan Pemaju Pembinaan)
                     </label>
                     <div class="col-lg-4">
                        <select id="ddlkategorirumah" name="ddlkategorirumah"  class="form-control m-input" onchange="getKategoriRumah($(this).val())" >
                           <option value="" hidden selected>Sila pilih kategori rumah</option>
                           <option value="Pangsapuri Kos Rendah">Pangsapuri Kos Rendah</option>
                           <option value="Pangsapuri Kos Sederhana Rendah<">Pangsapuri Kos Sederhana Rendah</option>
                           <option value="Pangsapuri Kos Sederhana">Pangsapuri Kos Sederhana</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>Kategori Pengurusan Rumah:
                     </label>
                     <div class="col-lg-4">
                        <select id="ddlkategoripengurusanrumah" name="ddlkategoripengurusanrumah" class="form-control m-input" onchange="getKategoriPengurusanRumah($(this).val())">
                           <option value="" hidden selected>Sila pilih kategori pengurusan rumah</option>
                           <option value="jmb">JMB/EJEN JMB</option>
                           <option value="mc">MC/EJEN JMB</option>
                           <option value="ejenyangdilantik">EJEN YANG DILANTIK COB,PBT</option>
                        </select>
                     </div>
                     <label class="col-lg-2 col-form-label">
                     <span style="color: red">* </span>Dun:
                     </label>
                     <div class="col-lg-4">
                        <select id="ddldun" name="ddldun" class="form-control m-input" onchange="getKategoriPengurusanRumah($(this).val())">
                           <option value="" hidden selected>Sila pilih DUN</option>
                           <option value="BALAKONG">BALAKONG</option>
                           <option value="BANDAR BARU KLANG">BANDAR BARU KLANG</option>
                           <option value="BANDAR UTAMA">BANDAR UTAMA</option>
                           <option value="BANTING">BANTING</option>
                           <option value="BATANG KALI">BATANG KALI</option>
                           <option value="BATU TIGA">BATU TIGA</option>
                           <option value="BUKIT ANTARABANGSA">BUKIT ANTARABANGSA</option>
                           <option value="BUKIT GASING">BUKIT GASING</option>
                           <option value="BUKIT LANJAN">BUKIT LANJAN</option>
                           <option value="BUKIT MELAWATI">BUKIT MELAWATI</option>
                           <option value="DENGKIL">DENGKIL</option>
                           <option value="DUSUN TUA">DUSUN TUA</option>
                           <option value="GOMBAK SETIA">GOMBAK SETIA</option>
                           <option value="HULU BERNAM">HULU BERNAM</option>
                           <option value="HULU KELANG">HULU KELANG</option>
                           <option value="IJOK">IJOK</option>
                           <option value="JERAM">JERAM</option>
                           <option value="KAJANG">KAJANG</option>
                           <option value="KAMPUNG TUNKU">KAMPUNG TUNKU</option>
                           <option value="KINRARA">KINRARA</option>
                           <option value="KOTA ANGGERIK">KOTA ANGGERIK</option>
                           <option value="KOTA DAMANSARA">KOTA DAMANSARA</option>
                           <option value="KOTA KEMUNING">KOTA KEMUNING</option>
                           <option value="KUALA KUBU BAHARU">KUALA KUBU BAHARU</option>
                           <option value="KUANG">KUANG</option>
                           <option value="LEMBAH JAYA">LEMBAH JAYA</option>
                           <option value="MERU">MERU</option>
                           <option value="MORIB">MORIB</option>
                           <option value="PANDAMARAN">PANDAMARAN</option>
                           <option value="PANDAN INDAH">PANDAN INDAH</option>
                           <option value="PAYA JARAS">PAYA JARAS</option>
                           <option value="PELABUHAN KLANG">PELABUHAN KLANG</option>
                           <option value="PERMATANG">PERMATANG</option>
                           <option value="RAWANG">RAWANG</option>
                           <option value="SABAK">SABAK</option>
                           <option value="SEKINCHAN">SEKINCHAN</option>
                           <option value="SELAT KLANG">SELAT KLANG</option>
                           <option value="SEMENTA">SEMENTA</option>
                           <option value="SEMENYIH">SEMENYIH</option>
                           <option value="SENTOSA">SENTOSA</option>
                           <option value="SERI KEMBANGAN">SERI KEMBANGAN</option>
                           <option value="SERI SERDANG">SERI SERDANG</option>
                           <option value="SERI SETIA">SERI SETIA</option>
                           <option value="SIJANGKANG">SIJANGKANG</option>
                           <option value="SUBANG JAYA">SUBANG JAYA</option>
                           <option value="SUNGAI AIR TAWAR">SUNGAI AIR TAWAR</option>
                           <option value="SUNGAI BURONG">SUNGAI BURONG</option>
                           <option value="SUNGAI KANDIS">SUNGAI KANDIS</option>
                           <option value="SUNGAI PANJANG">SUNGAI PANJANG</option>
                           <option value="SUNGAI PELEK">SUNGAI PELEK</option>
                           <option value="SUNGAI RAMAL">SUNGAI RAMAL</option>
                           <option value="SUNGAI TUA">SUNGAI TUA</option>
                           <option value="TAMAN MEDAN">TAMAN MEDAN</option>
                           <option value="TAMAN TEMPLER">TAMAN TEMPLER</option>
                           <option value="TANJONG SEPAT">TANJONG SEPAT</option>
                           <option value="TERATAI">TERATAI</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>Pengerusi / Orang Untuk Dihubungi:
                     </label>
                     <div class="col-lg-4">
                        <input type="text" class="form-control m-input" id="pengerusioranguntukdihubungi" name="pengerusioranguntukdihubungi" placeholder="Sila masukkan pengerusi / orang untuk dihubungi">
                     </div>
                     <label class="col-lg-2 col-form-label">
                     <span style="color: red">* </span>PBT:
                     </label>
                     <div class="col-lg-4">
                        <select id="ddlpbt" name="ddlpbt" class="form-control m-input" onchange="getPBT($(this).val())">
                           <option value="" hidden selected>Sila pilih PBT</option>
                           <option value="Majlis Bandaraya Shah Alam (MBSA)">Majlis Bandaraya Shah Alam (MBSA)</option>
                           <option value="Majlis Bandaraya Petaling Jaya (MBPJ)">Majlis Bandaraya Petaling Jaya (MBPJ)</option>
                           <option value="Majlis Perbandaran Subang Jaya (MPSJ)">Majlis Perbandaran Subang Jaya (MPSJ)</option>
                           <option value="Majlis Perbandaran Kajang (MPKJ)">Majlis Perbandaran Kajang (MPKJ)</option>
                           <option value="Majlis Perbandaran Selayang (MPS)">Majlis Perbandaran Selayang (MPS)</option>
                           <option value="Majlis Perbandaran Klang (MPK)">Majlis Perbandaran Klang (MPK)</option>
                           <option value="Majlis Perbandaran Ampang Jaya (MPAJ)">Majlis Perbandaran Ampang Jaya (MPAJ)</option>
                           <option value="Majlis Perbandaran Sepang (MPSEPANG)">Majlis Perbandaran Sepang (MPSEPANG)</option>
                           <option value="Majlis Daerah Kuala Selangor (MDKS)">Majlis Daerah Kuala Selangor (MDKS)</option>
                           <option value="Majlis Daerah Sabak Bernam (MDSB)">Majlis Daerah Sabak Bernam (MDSB)</option>
                           <option value="Majlis Daerah Hulu Selangor (MDHS)">Majlis Daerah Hulu Selangor (MDHS)</option>
                           <option value="Majlis Daerah Kuala Langat (MDKL)">Majlis Daerah Kuala Langat (MDKL)</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>No Telefon Pejabat:
                     </label>
                     <div class="col-lg-4">
                        <input type="text" class="form-control m-input" id="notelefonpejabat" name="notelefonpejabat" placeholder="Sila masukan no telefon pejabat">
                     </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="notelefonbimbit" name="notelefonbimbit" 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>No Telefon Fax:
                     </label>
                     <div class="col-lg-4">
                        <input type="text" class="form-control m-input" id="notelefonfax" name="notelefonfax" placeholder="Sila masukkan no telefon fax">
                     </div>
                     <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="emel" name="emel" placeholder="Sila masukkan emel" onblur="checkEmail($(this))" >
                     </div>
                  </div>
                  <div class="form-group m-form__group row">
                     <label class="col-lg-2 col-form-label">
                     <span style="color: red">* </span>Alamat Penuh:
                     </label>
                     <div class="col-lg-4">
                        <textarea   id="alamatpenuh" name="alamatpenuh" placeholder="Sila masukkan alamat penuh" class="form-control m-input"  rows="6" cols="5"></textarea>
                     </div>
                     <label class="col-lg-2 col-form-label">
                     <span style="color: red">* </span>Poskod:<br/><br/><br/><br/>
                     <span style="color: red">* </span>Negeri:
                     </label>
                     <div class="col-lg-4">
                        <input type="text" class="form-control m-input" id="poskod" name="poskod" placeholder="Sila masukan poskod"> <br><br>
                        <select class="form-control m-input" id="status_perkahwinan" name="status_perkahwinan" onchange="getNegeri($(this).val())">
                           <option value="" 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="Perak">Perak</option>
                           <option value="Perlis">Perlis</option>
                           <option value="Pulau Pinang">Pulau Pinang</option>
                           <option value="Sabah">Sabah</option>
                           <option value="Sarawak">Sarawak</option>
                           <option value="Selangor">Selangor</option>
                           <option value="Terengganu">Terengganu</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"></div>
               <div class="m-form__section m-form__section--middle">
                  <div class="m-form__heading">
                     <h3 class="m-form__heading-title">
                        Butiran Pangsapuri:
                     </h3>
                  </div>
                  <div class="form-group m-form__group row">
                     <label class="col-lg-2 col-form-label">
                     <span style="color: red">* </span>Bil Blok Pangsapuri:
                     </label>
                     <div class="col-lg-4">
                        <input type="text" class="form-control m-input" id="bilblokpangsapuri" name="bilblokpangsapuri" placeholder="Sila masukan bil blok pangsapuri">
                     </div>
                     <label class="col-lg-2 col-form-label">
                     <span style="color: red">* </span>Bil Unit Rumah:
                     </label>
                     <div class="col-lg-4">
                        <input type="text" class="form-control m-input" id="bilunitrumah" name="bilunitrumah" placeholder="Sila masukan bil unit rumah">
                     </div>
                  </div>
                  <div class="form-group m-form__group row">
                     <label class="col-lg-2 col-form-label">
                     <span style="color: red">* </span>Bil Tingkat Blok:
                     </label>
                     <div class="col-lg-4">
                        <input type="text" class="form-control m-input" id="biltingkatblok" name="biltingkatblok" placeholder="Sila masukan bil tingkat blok">
                     </div>
                     <label class="col-lg-2 col-form-label">
                     <span style="color: red">* </span>Bil Unit Lif(Sekiranya ada):
                     </label>
                     <div class="col-lg-4">
                        <input type="text" class="form-control m-input" id="bilunitlif" name="bilunitlif" placeholder="Sila masukan bil unit lif">
                     </div>
                  </div>
                  <div class="form-group m-form__group row">
                     <label class="col-lg-2 col-form-label">
                     <span style="color: red">* </span>Jenis Kerosakan Yang Ingin Dibaik Pulih(Hanya Satu Jenis Kerosakan Sahaja):
                     </label>
                     <div class="col-lg-4">
                        <input type="text" class="form-control m-input" id="jeniskerosakan" name="jeniskerosakan" placeholder="Sila masukan jenis kerosakan yang igin dibaik pulih">
                     </div>
                  </div>
               </div>
               <div class="m-form__seperator m-form__seperator--dashed"></div>
               <div class="m-form__section m-form__section--last">
                  <div class="m-form__heading">
                     <h3 class="m-form__heading-title">
                        LAMPIRAN DOKUMEN:
                     </h3>
                  </div>
                  <div class="form-group m-form__group row">
                     <table id="lampirandokumentunastable" class="table order" >
                        <thead >
                           <tr>
                              <td class="tablevisibility col-lg-10" 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="tablevisibility col-lg-1" id="rowmuatnaik2" ></td>
                              <td class="tablevisibility col-lg-1" id="rowpadam2" ><label class="labelwarning" id="ldrowCount"></label></td>
                           </tr>
                        </thead>
                        <tbody id="ldbodyrow">
                           <tr>
                              <td class="tablevisibility col-lg-10" id="rowinputdokumen">
                                 <input type="file" id="real-file" hidden="hidden" />
                                 <select id="ddlmaklumat" name="ddlmaklumat" class="form-control m-input" >
                                    <option selected="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="tablevisibility col-lg-1" 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="tablevisibility col-lg-1" 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" lass="tablebutton">Padam</span></span></div></td>
                           </tr>
                        </tbody>
                        <tfoot>
                           <tr>
                              <td>
                                 <div id="addrowlampirandokumentunas"  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" class="tablebutton" >Tambah</span></span></div>
                              </td>
                           </tr>
                        </tfoot>
                     </table>
                  </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 src="https://cdn.bootcss.com/webfont/1.6.16/webfontloader.js"></script>
<script type="text/javascript" src="lib\jquery-3.4.1.min.js"></script>
<script>
   $("#pengerusi").inputmask("Regex", { regex: "[a-zA-Z]*" });
   
   $('#notelefonpejabat,#notelefonfax').inputmask('Regex', { regex: "^(03)[0-9]{8}$"});
   
   $('#notelefonbimbit').inputmask('Regex', { regex: "^(01)[0-9]{8,9}$"});
   
   $("#poskod").inputmask({mask: "99999",placeholder: "" });      
   
   $("#bilblokpangsapuri,#biltingkatblok,#bilunitrumah,#bilunitlif").inputmask({ mask: "99",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();
           }
       }
       
   
   
   $(document).ready(function(){
     $("#inputalamatpenuh").on('input',function () {
       var namapangsapuri = $("#inputalamatpenuh").val();
       
   
        if(namapangsapuri.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('labelwarningalamatpenuh').innerHTML = 'Sila nyatakan alamat penuh.';
       } 
       else
       {            
           $(this).css({background:'url("")'});          
           document.getElementById('labelwarningalamatpenuh').innerHTML = '';
       }
     });
   });
   
   $("#inputjeniskerosakan").inputmask("Regex", { regex: "[a-zA-Z]*" });
   
   
   
   $(document).ready(function () {
       var counter = 0;
   
       $("#addrowlampirandokumentunas").on("click", function () {
           var newRow = $("<tr>");
           var cols = "";
   
         
   
           cols +=   '<td id="rowinputdokumen" class="tablevisibility col-lg-10"><input type="file" id="real-file" hidden="hidden" />'+
                     '<select id="ddlmaklumat" class="form-control m-input"  >'+ 
                     '<option selected="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>';
             cols += '<td id="rowmuatnaik" class="tablevisibility col-lg-1"><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 id="rowpadamlampirandokumen" class="tablevisibility col-lg-1"><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" 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