2010-07-08 85 views
0

我正在嘗試完成我的網頁的購物車,並且遇到了最後一個問題。我的'加入購物車'按鈕旁邊有一個文本框,需要在完成購買之前輸入特定的硬件密鑰(指紋)。我需要對其進行設置,以便最終用戶無法點擊「添加到購物車」,直到該字段被驗證。如果jquery驗證失敗,請禁用表單「操作」

我已成功設置驗證,使文本框需要,只允許特定的字符串,但我似乎無法弄清楚如何動態'禁用'窗體操作,直到文本框成功驗證。

這裏是我的jQuery:

<script> 
$(document).ready(function() { 

$.validator.addMethod("os0", function(value) { 
    return /^(([a-fA-F0-9]{4,4})+\-([a-fA-F0-9]{4,4}))$/.test(value); 
    }, "Invalid Fingerprint.");  

$("#myFingerprint").validate({ 
    rules: { 
     os0: "required os0", 
    },  
    }); 
}); 
</script> 

下面是相應的HTML:(表單代碼複製&從我們的電子商務提供商粘貼)

<td>                
<form id="myFingerprint" action="https://www.blahblahblah.com/ecom/gb.php?c=cart&i=770678&cl=122992&ejc=2" target="ej_ejc" method="POST" accept-charset="UTF-8"> 

<input type="hidden" name="on0" value="Fingerprint"/> 

Fingerprint:<br/> 

<input type="text" id="os0" name="os0" maxlength="9"/> 

<input type="image" src="http://www.blahblahblah.com/add_to_cart.gif" border="0" alt="Add to Cart" class="ec_ejc_thkbx" onClick="javascript:return EJEJC_lc(parent);"/> 
</form> 
</td> 

回答

2

你可以給一個形式onsubmit方法,然後取消表單提交如果表單未驗證。

$('#myFingerprint').submit(function (e) { 
    if(!all_of_my_validation_passed) { 
     e.preventDefault(); 
    } 
}); 
0

林肯,你是一個救命的人。這就像一個魅力。

雖然我確實有一個奇怪的發生。添加該腳本後,當輸入有效的硬件密鑰並單擊「添加到購物車」時,我的購物車現在會在新的瀏覽器選項卡中打開,而不是在同一窗口中彈出。這裏的任何想法?以防萬一,我的新的HTML表單代碼如下所示:

<form id="myFingerprint" action="https://www.e-junkie.com/ecom/gb.php?c=cart&i=770678&cl=122992&ejc=2" method="POST" onSubmit="return function(e)" target="ej_ejc" accept-charset="UTF-8"> 
+0

我對這些簡單的問題表示歉意。我仍然是JavaScript/jquery的新手。 – GetAwesome 2010-07-08 16:59:02

+0

您的表單具有'target'屬性,這會導致它在內部名稱爲「ej_ejc」的新選項卡中打開。如果你真的想在那裏,你應該只有這樣。此外,在SO上,當答案回答你的問題時,一定要點擊它旁邊的複選標記,以便海報得到讚譽:)謝謝! – Matchu 2010-07-08 17:00:20

+0

肯定會做。感謝您的領導! – GetAwesome 2010-07-08 17:01:41