驗證聯繫表格後顯示消息 - 引導驗證

我正在使用此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

添加您的代碼時，消息不會出現。 –

必須顯示您的標記和實施以進一步提供幫助。你可以創建一些小提琴和共享問題 –

對不起，你有小提琴鏈接更新 –

驗證聯繫表格後顯示消息 - 引導驗證

回答

相關問題