add.pt 7.25 KB
<html metal:use-macro="load: ../base.pt">
<div metal:fill-slot="content">
<h4>${request.title}</h4>
<hr>
<form id="deform" method="POST" enctype="multipart/form-data" accept-charset="utf-8" 
      class="form-horizontal">
  <fieldset class="deformFormFieldset">
    <input type="hidden" name="_charset_" />
    <input type="hidden" name="__formid__" value="deform"/>
    <div tal:condition="'id' in form">
      <div tal:define="field form['id']" style="display: none;">
          {structure:field.serialize()}
      </div>
    </div>
    
    <div class="col-md-8">
      <div class="form-group">
        <div class="col-md-6">
          <div class="form-group" tal:define="field form['kode']" id="item-${field.oid}">
            <label for="${field.oid}" class="control-label col-md-4" id="req-${field.oid}">
                    ${field.title}</label>
            <div class="col-md-8">
               ${structure:field.serialize()}
              <p id="error-${field.oid}" class="help-block" tal:condition="field.error"
                 tal:repeat="error field.error.messages()">
                 ${error}</p>
            </div>
          </div>
        </div>
      </div>
      <div class="form-group" tal:define="field form['nama']" id="item-${field.oid}">
        <label for="${field.oid}" class="control-label col-md-2" id="req-${field.oid}">
                ${field.title}</label>
        <div class="col-md-10">
           ${structure:field.serialize()}
            <p id="error-${field.oid}" class="help-block" tal:condition="field.error"
               tal:repeat="error field.error.messages()">
               ${error}</p>
        </div>
      </div>
      <div class="form-group">
        <div class="col-md-6">
          <div class="form-group" tal:define="field form['source_type']" id="item-${field.oid}">
            <label for="${field.oid}" class="control-label col-md-4" id="req-${field.oid}">
                    ${field.title}</label>
            <div class="col-md-6">
               ${structure:field.serialize()}
                <p id="error-${field.oid}" class="help-block" tal:condition="field.error"
                   tal:repeat="error field.error.messages()">
                   ${error}</p>
            </div>
          </div>
        </div>
        <div class="col-md-6">
          <div class="form-group" tal:define="field form['is_sum']" id="item-${field.oid}">
            <label for="${field.oid}" class="control-label col-md-6" id="req-${field.oid}">
                    ${field.title}</label>
            <div class="col-md-6">
               ${structure:field.serialize()}
                <p id="error-${field.oid}" class="help-block" tal:condition="field.error"
                   tal:repeat="error field.error.messages()">
                   ${error}</p>
            </div>
          </div>
        </div>
        
      </div>
      <div class="form-group" tal:define="field form['rekening_kd']" id="item-${field.oid}">
        <label for="${field.oid}" class="control-label col-md-2" id="req-${field.oid}">
                ${field.title}</label>
        <div class="col-md-10">
           ${structure:field.serialize()}
            <p id="error-${field.oid}" class="help-block" tal:condition="field.error"
               tal:repeat="error field.error.messages()">
               ${error}</p>
        </div>
      </div>
      <div class="form-group">
        <div class="col-sm-6">
          <div class="form-group" tal:define="field form['color']" id="item-${field.oid}">
            <label for="${field.oid}" class="control-label col-md-2" id="req-${field.oid}">
                    ${field.title}</label>
            <div class="col-md-10">
               ${structure:field.serialize()}
                <p id="error-${field.oid}" class="help-block" tal:condition="field.error"
                   tal:repeat="error field.error.messages()">
                   ${error}</p>
            </div>
          </div>
        </div>
        <div class="col-sm-6">
          <div class="form-group" tal:define="field form['highlight']" id="item-${field.oid}">
            <label for="${field.oid}" class="control-label col-md-2" id="req-${field.oid}">
                    ${field.title}</label>
            <div class="col-md-10">
               ${structure:field.serialize()}
                <p id="error-${field.oid}" class="help-block" tal:condition="field.error"
                   tal:repeat="error field.error.messages()">
                   ${error}</p>
            </div>
          </div>
        </div>
      </div>  
      <div class="form-group">
        <div class="col-md-6">
          <div class="panel panel-default" title="">
            <div class="panel-heading">Group 1</div>
            <div class="panel-body">
                  ${form.start_mapping('values_1')}
                    <!--div class="row collapse collapse error"if field.error:-->
                    <div class="form-group"  tal:repeat="field form['values_1']">
                        <label class="control-label col-md-3">${field.title}</label>
                        <div class="col-md-8">
                          ${structure:field.serialize()}
                          <p id="error-${field.oid}" class="help-block" tal:condition="field.error"
                             tal:repeat="error field.error.messages()">
                             ${error}</p>
                        </div>
                    </div>
                  ${form.end_mapping('values_1')}
            </div>
          </div>
        </div>
        <div class="col-md-6">
          <div class="panel panel-default" title="">
            <div class="panel-heading">Group 2</div>
            <div class="panel-body">
                  ${form.start_mapping('values_2')}
                    <!--div class="row collapse collapse error"if field.error:-->
                    <div class="form-group"  tal:repeat="field form['values_2']">
                        <label class="control-label col-md-3">${field.title}</label>
                        <div class="col-md-8">
                          ${structure:field.serialize()}
                          <p id="error-${field.oid}" class="help-block" tal:condition="field.error"
                             tal:repeat="error field.error.messages()">
                             ${error}</p>
                        </div>
                    </div>
                  ${form.end_mapping('values_2')}
            </div>
          </div>
        </div>
      </div>

      <div class="col-md-offset-2">
        <div class="form-group">
            <button id="deformsave" name="simpan" type="submit" class="btn btn-primary "
                  value="simpan">Simpan</button>
            <button id="deformcancel" name="batal" type="submit" class="btn btn-default "
                  value="batal">Batal</button>
        
        </div>
      </div>
    </div>

  </fieldset>
</form>
</div>
    <script>
      var nip_field='${field.oid}';
      var nm_field ='${field.oid}';
      var gj_field ='${field.oid}';
    </script>
          <script>
          $('#${field.oid}').bind('typeahead:selected', function(obj, datum, name) {      
                $('#'+nip_field).val(datum.nip);
                $('#'+nm_field).val(datum.nama);
                $('#'+id_field).val(datum.id);
                $('#'+gj_field).val(datum.gaji_bersih);
          });
            </script>

</html>