add.pt 5.41 KB
<html metal:use-macro="load: ../base.pt">
<div metal:fill-slot="content" class="form-550">
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
<h4>Registrasi e-Samsat</h4>
<!--h4>Registrasi e-PKB</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-13">
        <!--no_rangka ------------------------------->
        <div class="form-group" tal:define="field form['no_rangka']" id="item-${field.oid}">
          <label for="${field.oid}" class="control-label col-md-3" id="req-${field.oid}">
              ${field.title}<span id="error-${field.oid}" class="text text-danger"
                                  tal:condition="field.required">&nbsp*</span></label>
          <div class="col-md-9">
              ${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>
        <!--no_ktp ------------------------------->
        <div class="form-group" tal:define="field form['no_ktp']" id="item-${field.oid}">
          <label for="${field.oid}" class="control-label col-md-3" id="req-${field.oid}">
              ${field.title}<span id="error-${field.oid}" class="text text-danger"
                                  tal:condition="field.required">&nbsp*</span></label>
          <div class="col-md-9">
              ${structure:field.serialize()}
              <script>
                $(document).ready(function () {
                //Membatasi 16 Digit & Membatasi Huruf
                $('#no_ktp').keyup(function(){
                    var no_ktp  = this.value.length;
                    if(!/^[0-9]+$/.test(this.value)){
                        this.value=this.value.substring(0,no_ktp - 1);
                     }
                    else if (no_ktp >= 16){
                    this.value=this.value.substring(0,16);
                    }
                });
                });
              </script>
              <p id="error-${field.oid}" class="help-block" tal:condition="field.error"
                           tal:repeat="error field.error.messages()">
                           ${error}</p>          
          </div>
        </div>
        <!--email ------------------------------->
        <div class="form-group" tal:define="field form['email']" id="item-${field.oid}">
          <label for="${field.oid}" class="control-label col-md-3" id="req-${field.oid}">
              ${field.title}<span id="error-${field.oid}" class="text text-danger"
                                  tal:condition="field.required">&nbsp*</span></label>
          <div class="col-md-9">
              ${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>
        <!--no_handphone ------------------------------->
        <div class="form-group" tal:define="field form['no_hp']" id="item-${field.oid}">
          <label for="${field.oid}" class="control-label col-md-3" id="req-${field.oid}">
              ${field.title}<span id="error-${field.oid}" class="text text-danger"
                                  tal:condition="field.required">&nbsp*</span></label>
          <div class="col-md-9">
              ${structure:field.serialize()}
              <script>
                $(document).ready(function () {
                //Membatasi 14 Digit & Membatasi Huruf
                $('#no_hp').keyup(function(){
                    var no_hp  = this.value.length;
                    if(!/^[0-9]+$/.test(this.value)){
                        this.value=this.value.substring(0,no_hp - 1);
                     }
                    else if (no_hp >= 20){
                    this.value=this.value.substring(0,20);
                    }
                });
                });
              </script>
              <p id="error-${field.oid}" class="help-block" tal:condition="field.error"
                           tal:repeat="error field.error.messages()">
                           ${error}</p>          
          </div>
        </div>
        <!--g-recaptcha ------------------------------->
        <div class="form-group">
        <div class="col-md-offset-4">
            <div class="g-recaptcha" data-sitekey="6LcGLQATAAAAABtqq0J20BATKsZPGXwBVj6i5zk_"></div>
        </div>
        </div!>
        <!--Button ------------------------------->
        <div class="form-group">
        <label class="control-label col-md-3">
          </label>
          <div class="col-md-9">
                <button id="deformsave" name="simpan" type="submit" class="btn btn-primary "
                    value="simpan">Proses</button>
                <button id="deformcancel" name="cancel" type="submit" class="btn btn-default "
                    value="cancel">Batal</button>
       
          </div>
        </div>
        
      </div>
  </fieldset>
</form>
</div>
</html>