magento 表单提交处理程序答案

【问题标题】：magento form submit handlermagento 表单提交处理程序
【发布时间】：2015-09-11 13:58:56
【问题描述】：

我们有一个使用 WebForms2 插件的 magento 站点，最终使用类似于以下生成的表单代码：

HTML

<form action="http://example.com/magento/index.php/webforms/index/iframe" method="post" name="webform_2" id="webform_2" enctype="application/x-www-form-urlencoded" class="webforms-lg-test" target="webform_2_iframe">
  <input type="hidden" name="submitWebform_2" value="1"/>
  <input type="hidden" name="webform_id" value="2"/>

  <div id="fieldset_0" class="fieldset fieldset-0 ">
    <ul class="form-list">
      <li class="fields ">
        <div id="field_11" class="field  type-text webforms-fields-11 webforms-fields-name">
          <label id="label_field11" for="field11">Name</label>
          <div class="input-box">
            <input type='text' name='field[11]' id='field11' class='input text ' style='' value="" />
          </div>
        </div>
      </li>
    </ul>
  </div>

  <div class="buttons-set">
    <p class="required">* Required Fields</p>
    <button type="button" class="button" id="webform_2_submit_button" onclick="webform_2_submit()" title="submit">
      <span>
        <span>Submit</span>
      </span>
    </button>
    <span class="please-wait" id="webform_2_sending_data" style="display:none;">
      <img src="http://example.com/magento/skin/frontend/default/default/images/opc-ajax-loader.gif" alt="Sending..." title="Sending..." class="v-middle"/>
      <span id="webform_2_progress_text">Sending...</span>
    </span>
  </div>
</form>

var webform_2 = new VarienForm('webform_2', 0);
var webform_2_submit = function(){
  var form = webform_2;
  if(form.validator && form.validator.validate()){
    form.submit();
    $('webform_2_submit_button').hide();
    $('webform_2_sending_data').show();
  }
};

棘手的部分是我们有一个额外的工具可以处理所有表单。以前我们只是将它挂接到表单提交处理程序中，但是 Magento/WebForms 使用的这种特殊方法不会触发提交处理程序。

我们工具的代码示例：

var forms = document.getElementsByTagName('form');
for(i=0; i<forms.length; i++) {
  forms[i].addEventListener('submit', function() {
    alert('form submitted');
  } 
}

我们也使用了 jQuery 方法，但为了减少依赖而对其进行了缩减。它也没有工作。

$('form').on('submit', function(e) {
  alert('form submitted');
});

问题

Magento 中是否有一些特定的东西可以与这个实现一起使用，而不是标准的提交处理程序？还是观察表单提交处理程序的不同/更好的方式？

【问题讨论】：

标签： javascript jquery forms magento

【解决方案1】：

使用原型我能够覆盖现有的提交处理程序。

VarienForm.prototype.submit = VarienForm.prototype.submit.wrap(function($super, url) {
    //-- your code can go before OR after the default form behavior

    //-- include this if you want to include the previous submit behavior
    $super(url);
    return false;
});

【讨论】：