departemen_chg.pt 2.16 KB
<html metal:use-macro="load: base3.1.pt">
<div metal:fill-slot="content">
  <div class="panel panel-default">
    <div class="panel-heading">
      <h3 class="panel-title">${request.title}</h3>
    </div>
    <div class="panel-body">
      <form method="post" accept-charset="utf-8" id="myform" class="form-horizontal" enctype="multipart/form-data">
        <div class="alert alert-danger" tal:condition="form and form.error and True or False">
          <div class="error-msg-lbl">Kesalahan Pengisian Form</div>
          <p class="error-msg">${form.errormsg}</p>
        </div>
        <div class="form-group" tal:repeat="f form">
          <div id="item-${f.oid}" style="${f.widget.hidden and 'display:none;' or 'display:block;'}">
            <label for="${f.oid}" class="control-label col-md-2 ${f.required and 'required' or ''} " id="req-${f.oid}">
                ${f.title}</label>

            <div class="col-md-3">
            ${structure:f.serialize()}
              <p id="error-${f.oid}" class="help-block" tal:condition="f.error"
                   tal:repeat="error f.error.messages()">
                  ${error}</p>
            </div>
          </div>
        </div>
        <div class="col-md-4">
          <label class="control-label col-md-3"></label>
          <button type="submit" class="btn btn-primary" id="simpan" name="simpan">Simpan</button>
          <button type="submit" class="btn btn-warning" id="batal" name="batal">Tutup</button>
        </div>
      </form>
    </div>  <!--panel-body-->
  </div>
</div>
<div metal:fill-slot="scripts">
  <script src="${home}/deform_static/scripts/typeahead.min.js"></script>
    <script>
      $(document).ready(function () {
      $('#departemen_nm').typeahead({"minLength": 1, "remote": "/departemen/hon_level/act?term=%QUERY", "limit": 8});
      $('#departemen_nm').bind('typeahead:selected', function (obj, datum, name) {
      $('#departemen_id').val(datum.id);
      $('#departemen_kd').val(datum.kode);
      $('#level_id').val(datum.level_id);
    });
      $('#departemen_kd').attr("readonly", true);
      $('#level_id').attr("readonly", true);

    });
  </script>
</div>
</html>