验证联系表格后显示消息 - 引导验证

我正在使用此Bootstrap Plugin，我只想在确认表格后立即显示确认提交消息（JSFiddle）。验证联系表格后显示消息 - 引导验证

插件的开发者注意到以下几点：

当窗体是无效的，.preventDefault（）调用提交事件。因此，如果您想要勾选提交事件并根据表单是否有效进行有条件地执行，您可以检查事件是否为.isDefaultPrevented（）。请确保您的提交处理程序在插件初始化完成后绑定。

几次尝试后，于是我就想出了这个代码（不工作）：

$('#form').validator().on('submit', function (e) { 
    if (e.isDefaultPrevented()) { 
    $('button').click(function(){ 
     $('.alert').hide() 
    }) 
    } else { 
    $('button').click(function(){ 
     $('.alert').show() 
    }) 
    } 
})

什么我究竟缺少什么？

UPDATE

作为@Nikhil Nanjappa提供我与另一个问题就出来了该解决方案，由于接触形式重新加载内容，消息被示出的一个milisecond（JSFiddle Updated）。有什么办法可以防止这种行为？

UPDATE2

为了使它工作，我只是说处理表单提交“提交”事件并添加return false，使代码看起来是这样的：

在

$('#form').on('valid.bs.validator', function(){ 
    $('button').click(function(){ 
     $('.alert').show() 
      return false; 
    }) 
    $('.alert').delay(3000).fadeOut("slow"); 

});

来源

2016-02-26 Xavi Alsina

你的代码和小提琴的

我也没有看到你在哪里参考插件在你的小提琴..你只使用引导资源而不是插件.. – DTH

对不起，小提琴更新 –

在你给了相同的链接参考，我发现这个事件here。

valid.bs.validator - 当表单字段有效时触发此事件。提供以前的现场错误。

$('#someFormId').on('valid.bs.validator', function(){ 
    showTheMessage(); 
});

简单和干净。如果其他循环遍历，则不必使用。

更新时间：

你需要做一些改动：

首先在validator.js在Fiddle即使工作不是因为它呼吁通过HTTP协议和的jsfiddle应该的网址是https，因此将validator.js的外部资源URL更改为https://1000hz.gi...。
其次，我看到的窗体有2个id。保留你使用的那个（formulario-cdb）。
这是重载的主要罪魁祸首，没有任何提交处理程序表单正在提交，所以它只意味着“发送按钮”类型为submit。更改为type="button"

现在你可以看到报警显示，并坚持有没有重新加载页面。

来源

2016-02-26 09:28:36

谢谢，这项工作完美无瑕，但现在我面临另一个问题，因为联系表单重新加载页面，所以消息根本没有显示。 –

好的，现在你的意思是，你需要页面重新加载后的消息？或者你只想延长显示的消息时间并让页面重新加载后？ –

我只是想在联系表格被验证时显示消息，并将其保存在屏幕上。我的解决方案只是在“提交”事件中处理了表单提交并添加了返回false –

提交处理你必须显示或隐藏警报。但在您的代码中，您正在注册事件侦听器以进行按钮单击。它只注册事件并且不会触发警报。更改代码如下

$('#form').validator().on('submit', function (e) { 
    if (e.isDefaultPrevented()) { 

     $('.alert').hide() 

    } else { 

     $('.alert').show() 

    } 
})

来源

2016-02-26 09:11:41

添加您的代码时，消息不会出现。 –

必须显示您的标记和实施以进一步提供帮助。你可以创建一些小提琴和共享问题 –

对不起，你有小提琴链接更新 –

验证联系表格后显示消息 - 引导验证

回答

相关问题