我在当前的重力形式上使用了一些 jQuery。但是,当我提交表单并返回错误的验证时,我丢失了一些 jQuery 目标。
我很好奇$(document).ready(function() {
,一旦字段被错误的验证重新加载,我怎么能换掉一些会调用我的 jQuery 的东西。
不过我试过$("#gform_submit_button_1").click(function() {
了,太早了。它需要在新字段从 ajax 返回时发生。
这里实际上提供了一个钩子供使用:gform_post_render
每次呈现表单时都会触发此 jQuery 钩子,以允许执行自定义 jQuery。这包括初始表单加载、转到多页表单的下一页/上一页、呈现验证错误的表单、显示的确认消息等。
jQuery(document).bind('gform_post_render', function(){
// code to trigger on AJAX form render
});
出于某种原因,Gravity Forms 仍然没有为失败的表单验证添加 jQuery 挂钩。他们建议做的是检查div.validation_error
.
jQuery(document).on('gform_post_render', function(e, form_id) {
if ( jQuery('div.validation_error').length > 0 ) {
console.log('Form validation error.');
}
});
当我检查验证错误元素时,您会注意到我没有指定父级:jQuery('div.validation_error')
. 如果页面上有多个表单,这将导致问题。返回的form_id
参数包含数据库中表单的 ID(例如 1、2、35 等),但我不确定此值是否与 HTML 中的表单 ID 匹配,例如<form id="gform_1">
. 如果确实匹配,那么最好指定父级,因此您可以这样做:
if ( jQuery('div.validation_error', '#gform_' + form_id).length > 0 ) {
也许其他人可以参与并让我们知道表单的 HTML ID 是否始终与表单的数据库 ID 匹配。
重力形式确实提供了一个gform_confirmation_loaded
钩子,但我认为这不适用于您的情况,因为它不是加载确认,而是加载错误状态表单。他们对此没有钩子,但我已经成功使用 jquery 委托事件。我将.gform_wrapper
用作我的第一个选择器,然后定位我想要实际定位的字段。
有关更多信息,请参阅此文档:
一种解决方案是:捕获提交事件并启动一个间隔来检查您的表单是否有更改,然后调用您的函数:
$('#your-form').submit(function(){
html = $('#your-form').html();
iv = setInterval(function(){
If($('#your-form').html != html){
yourfunc();
clearInterval(iv);
}
}, 200);
});
function yourfunc(){
//your stuff
}
然而,这不是很整洁,只有在 Ajax 调用之后实际更改了 html 时才会起作用。