form.pt 4.12 KB
<form
    tal:define="style style|field.widget.style;
              css_class css_class|string:${field.widget.css_class or field.css_class or ''};
              item_template item_template|field.widget.item_template;
              autocomplete autocomplete|field.autocomplete;
              title title|field.title;
              errormsg errormsg|field.errormsg;
              description description|field.description;
              buttons buttons|field.buttons;
              use_ajax use_ajax|field.use_ajax;
              ajax_options ajax_options|field.ajax_options;
              formid formid|field.formid;
              action action|field.action or None;
              method method|field.method;"
    tal:attributes="autocomplete autocomplete;
                  style style;
                  class css_class;
                  action action;
                  attributes|field.widget.attributes|{};"
    id="${formid}"
    method="${method}"
    enctype="multipart/form-data"
    accept-charset="utf-8"
    class="deform ${field.bootstrap_form_style | 'form-horizontal'}"
    i18n:domain="deform"
>

  <fieldset class="deform-form-fieldset">
    <div class="row">
      <legend tal:condition="title">${title}</legend>
      <input type="hidden" name="_charset_"/>
      <input type="hidden" name="__formid__" value="${formid}"/>
      <div class="alert alert-danger" tal:condition="field.error">
        <div class="error-msg-lbl" i18n:translate=""
        >There was a problem with your submission
        </div>
        <div class="error-msg-detail" i18n:translate=""
        >Errors have been highlighted below
        </div>
        <p class="error-msg">${field.errormsg}</p>
      </div>

      <p class="section first" tal:condition="description">
        ${description}
      </p>
      <div tal:repeat="child field"
           tal:replace="structure child.render_template(item_template)"/>
    </div>
    <div class="row">
      <div class="form-group deform-form-buttons">
        <tal:loop tal:repeat="button buttons">
          <button
              tal:define="btn_disposition repeat.button.start and 'btn-primary' or 'btn-default';"
              tal:attributes="disabled button.disabled if button.disabled else None;
                              attributes|button.attributes|{};"
              id="${formid+button.name}"
              name="${button.name}"
              type="${button.type}"
              class="btn ${button.css_class or btn_disposition}"
              value="${button.value}"
              tal:condition="button.type != 'link'">
            <span tal:condition="button.icon" class="glyphicon glyphicon-${button.icon}"></span>
            ${button.title}
          </button>
          <a
              tal:define="btn_disposition repeat.button.start and 'btn-primary' or 'btn-default';
              btn_href button.value|''"
              class="btn ${button.css_class or btn_disposition}"
              id="${field.formid + button.name}"
              href="${btn_href}"
              tal:condition="button.type == 'link'">
            <span tal:condition="button.icon" class="glyphicon glyphicon-${button.icon}"></span>
            ${button.title}
          </a>
        </tal:loop>
      </div>
    </div>
  </fieldset>

  <script type="text/javascript" tal:condition="use_ajax">
   deform.addCallback(
     '${formid}',
     function(oid) {
       var target = '#' + oid;
       var options = {
         target: target,
         replaceTarget: true,
         success: function() {
           deform.processCallbacks();
           deform.focusFirstInput(target);
         },
         beforeSerialize: function() {
           // See http://bit.ly/1agBs9Z (hack to fix tinymce-related ajax bug)
           if ('tinymce' in window) {
             $(tinymce.get()).each(
               function(i, el) {
                 var content = el.getContent();
                 var editor_input = document.getElementById(el.id);
                 editor_input.value = content;
             });
           }
         }
       };
       var extra_options = ${ajax_options} || {};
       $('#' + oid).ajaxForm($.extend(options, extra_options));
     }
   );



  </script>

</form>