chg.pt 3.17 KB
<html metal:use-macro="load: ../base3.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-4 ${f.required and 'required' or ''} " id="req-${f.oid}">
                          ${f.title}</label>
                 
                  <div class="col-md-7 col-sm-8">
                      ${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-offset-8"> 
              <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>
      </div> 
  </div>
  <div metal:fill-slot="scripts">
    <script>  
      $(document).ready(function () {
        $('#departemen_nm').typeahead({"minLength": 1, "remote": "${request._host}/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);
        
        /*$('#departemen_id').select2({
            ajax: {
                url: '${request._host}/departemen/hon_level/act',
                dataType: 'json',
                type: "GET",
                quietMillis: 50,
                data: function (q) {
                    return {
                        'term': q.term
                    };
                },
                processResults: function (data) {
                    return {
                        results: $.map(data, function (item) {
                            $('#departemen_kd').val(item.kode);
                            $('#level_id').val(item.level_id);
                            return {
                                text: item.nama,
                                id: item.id
                            }
                        })
                    };
                }
            }
        });*/
            
      });
    </script>
   </div>
</html>