<?= form_open("", 'id="pdkjabatan_form"', ['id' => $id]) ?>
   <?= xform_input('nama_jabatan', 'Nama Jabatan', $nama_jabatan, 3, 9, true, 150, 'ginputx') ?>
   <?= xform_input('nama_sjab', 'Shortname', $nama_sjab, 3, 9, true, 150, 'ginputx') ?>
   <?= xform_input('nama_alt', 'Nama Alt.', $nama_alt, 3, 9, true, 150, 'ginputx') ?>
   <?= xform_input('urutan', 'Urutan', $urutan, 3, 9, true, 2, 'angkax') ?>
   <hr>
   <div class="invalid-feedback text-center" id="em_message"></div>
   <div class="clearfix">
      <?= form_submit('btn_pdkjabatan', $button, 'waves-effect waves-themed float-right') ?>
   </div>
</form>

<script type="text/javascript">

$('.ginputx').inputmask({
  regex: "^[a-zA-Z0-9\\s.,@-]*$"
});

$('.angkax').numeric();

$("#pdkjabatan_form").submit(function(e){
  e.preventDefault();
  var url = '<?= $action ?>'
  var formData = $(this).serialize();
  $.ajax({
      url: url,
      type: "post",
      dataType: 'json',
      data: formData,
      beforeSend  : function() {
         $(".form-control").removeClass("is-invalid");
         $(".invalid-feedback").html('').hide();
         BtnLoading($("#btn_pdkjabatan"));
      },
      error: function (xhr, status, message) {
         var res = JSON.parse(xhr.responseText);
         $(res.messages).each(function(i,val){
            var inputname = Object.keys(val)[0];
            $.each(val,function(k,v){
               $("#"+inputname).focus();
               $("#"+k).addClass("is-invalid");
               $("#em_"+k).html(v).fadeIn();
            });
         });
         BtnReset($("#btn_pdkjabatan"));
      },
      success: function(res) {
         $('#nama_jabatan').val('');
         $('#nama_sjab').val('');
         $('#nama_alt').val('');
         $('#urutan').val('');
         $('#datagrid').datagrid('load');
         new_data();
         toastr.success(res.message, 'Updated!!', {timeOut: 3000});
      },
      complete: function() {
         BtnReset($("#btn_pdkjabatan"));
      }
  });
});
</script>