Foundation 6 Abide - 如何实现formnovalidate
Foundation 6 Abide - How to implement formnovalidate
我有一个使用 Abide 的表单。表单有两个按钮,都是 type="submit" 但其中一个设置了 formnovalidate 属性。此按钮用于 "previous step",因为它接受用户填写的任何内容并提交表单,将用户带到表单的上一步。
问题是当用户点击取消阻止用户返回时,遵守验证仍然启动,直到他填写了当前步骤的所有字段。 HTML5 验证具有完全适用于此用例的 formnovalidate 属性。有没有办法 "ignore/skip" 单击取消按钮时遵守验证?
在 github 上发布 link:https://github.com/zurb/foundation-sites/issues/11426#issuecomment-441956255
已在 github 问题中解决。目前 Foundation 对此没有原生支持。解决方法是在 Foundation JS 中重写提交处理程序。我是这样做的:
.on( "submit.zf.abide", function( e ){
var $btn = $(document.activeElement);
if (
/* there is an activeElement at all */
$btn.length &&
/* it's a child of the form */
t.$element.has($btn) &&
/* it's really a submit element */
$btn.is('[type="submit"]') &&
/* it has a "formnovalidate" attribute */
$btn.is('[formnovalidate]')
) {
return true;
}else{
return t.validateForm()
}
})
我有一个使用 Abide 的表单。表单有两个按钮,都是 type="submit" 但其中一个设置了 formnovalidate 属性。此按钮用于 "previous step",因为它接受用户填写的任何内容并提交表单,将用户带到表单的上一步。
问题是当用户点击取消阻止用户返回时,遵守验证仍然启动,直到他填写了当前步骤的所有字段。 HTML5 验证具有完全适用于此用例的 formnovalidate 属性。有没有办法 "ignore/skip" 单击取消按钮时遵守验证?
在 github 上发布 link:https://github.com/zurb/foundation-sites/issues/11426#issuecomment-441956255
已在 github 问题中解决。目前 Foundation 对此没有原生支持。解决方法是在 Foundation JS 中重写提交处理程序。我是这样做的:
.on( "submit.zf.abide", function( e ){
var $btn = $(document.activeElement);
if (
/* there is an activeElement at all */
$btn.length &&
/* it's a child of the form */
t.$element.has($btn) &&
/* it's really a submit element */
$btn.is('[type="submit"]') &&
/* it has a "formnovalidate" attribute */
$btn.is('[formnovalidate]')
) {
return true;
}else{
return t.validateForm()
}
})