1
我有一個頁面，用戶被要求輸入付款詳細信息。這包括賬單和信用卡/支票賬戶信息。他們初次訪問此頁面時，所有驗證規則都會正確啓動。然後，他們點擊底部的繼續按鈕，他們會進入一個彙總頁面，顯示他們輸入的所有內容，並允許他們提交付款或按編輯按鈕並返回上一頁，以更新他們所需的任何字段。第2次jQuery驗證不起作用頁面
但是，當它們正在編輯時，驗證規則都不再起作用。
是的，是的，我已經實現了服務器端驗證，所以這實際上只是錦上添花，但它使用戶體驗更好，當它不讓他們等待回傳時。 。
我在驗證插件1.8.1中使用jQuery 1.4.4。有很多驗證規則，因此我將它們分成了自己的.js文件，該文件在我的html中引用。
我附加了驗證器js文件中的代碼，請記住這些ALL初始時間，只有在重新訪問（使用VB.Net中的Response.Redirect返回頁面）之後，它們是否停止工作。使用Firebug進行調試時，我無法在$(document).ready()塊中第二次放置任何斷點。
// JScript File
$.validator.addMethod('postalCode', function (value, element) {
return this.optional(element) || /^((\d{5}-\d{4})|(\d{5})|([A-Z]\d[A-Z]\s\d[A- Z]\d))$/.test(value);
}, 'Please enter a valid US or Canadian postal code.');
$.validator.addMethod('cvnnum', function (value, element) {
return this.optional(element) || /^((\d{3})|(\d{4}))$/.test(value);
}, 'Please enter a valid CVN.');
$.validator.addMethod('CCExp', function(value, element, params) {
var minMonth = new Date().getMonth() + 1;
var minYear = new Date().getFullYear();
var month = parseInt($(params.month).val(), 10);
var year = parseInt($(params.year).val(), 10);
return this.optional(element) || ((year > minYear || (year === minYear && month >= minMonth)));
}, 'Please select a valid expiration date.');
$.validator.addMethod('routingnum', function (value, element) {
// algorithm taken from: http://www.brainjar.com/js/validation/
var t = value;
n = 0;
for (i = 0; i < t.length; i += 3) {
n += parseInt(t.charAt(i), 10) * 3
+ parseInt(t.charAt(i + 1), 10) * 7
+ parseInt(t.charAt(i + 2), 10);
}
// If the resulting sum is an even multiple of ten (but not zero),
// the aba routing number is good.
if (n != 0 && n % 10 == 0)
return true;
else
return (this.optional(element) || false);
}, 'Please enter a valid routing number.');
$.validator.addMethod("phoneUS", function(phone_number, element) {
phone_number = phone_number.replace(/\s+/g, "");
return this.optional(element) || phone_number.length > 9 &&
phone_number.match(/^(1-?)?(\([2-9]\d{2}\)|[2-9]\d{2})-?[2-9]\d{2}-?\d{4}$/);
}, "Please specify a valid phone number");
//had to rewrite equalTo as it didn't follow the required or depends properties correctly..
$.validator.addMethod("myEqualTo", function (value, element, param) {
return this.optional(element) || value === $(param).val();
}, jQuery.format("You must enter {0}"));
$(document).ready(function() {
$("#form1").validate({
rules: {
PayType: { required: true },
Email: { required: true },
txtCCFullName: { required: isCreditCard },
txtCCFName: { required: isCreditCard },
txtCCLName: { required: isCreditCard },
txtCCNumber: { creditcard: true, required: isCreditCard },
txtCCSecurityNum: { cvnnum: true, required: isCreditCard },
ddlCCExpYear: {
required: isCreditCard,
CCExp: {
month: '#ddlCCExpMonth',
year: '#ddlCCExpYear'
}
},
txtCCAdd1: { required: isCreditCard },
txtCCCity: { required: isCreditCard },
txtCCState: { required: isCreditCard },
txtCCZip: { postalCode: true, required: isCreditCard },
txtAmtOther: {
number: true,
required: function() { return $('input[name=PayType][value=rbtAmtOther]:checked').length > 0; }
},
txtACHRoutingNum: { routingnum: true, required: isACH },
txtACHAcctNum: { number: true, required: isACH },
txtACHFName: { required: isACH },
txtACHLName: { required: isACH },
txtACHAdd1: { required: isACH },
txtACHCity: { required: isACH },
txtACHState: { required: isACH },
txtACHZip: { postalCode: true, required: isACH },
txtPayorEmail: {
email: true,
required: {
depends: function (element) { return $('input[id=rbtEmailYes]:checked').length > 0; }
}
},
txtConfEmail: {
myEqualTo: '#txtPayorEmail',
//required: false
required: {
depends: function (element) {
return ($('div[id=ConfirmEmail]:visible').length > 0) && ($('input[id=rbtEmailYes]:checked').length > 0);
}
}
}
},
messages: {
Email: { required: 'Please answer the payor email question.' },
PayType: { required: 'Please select a payment type.' },
// blank messages suppress the individual error messages
txtCCFullName: { required: '' },
txtCCFName: { required: '' },
txtCCLName: { required: '' },
txtCCNumber: { required: '' },
txtCCSecurityNum: { required: '' },
txtAmtOther: { required: '' },
txtACHFName: { required: '' },
txtACHLName: { required: '' },
txtACHRoutingNum: { required: '' },
txtACHAcctNum: { required: '' },
txtACHAdd1: { required: '' },
txtACHCity: { required: '' },
txtACHState: { required: '' },
txtACHZip: { required: '' },
txtCCAdd1: { required: '' },
txtCCCity: { required: '' },
txtCCState: { required: '' },
txtCCZip: { required: '' },
txtPayorEmail: { required: '' },
txtConfEmail: { required: '', myEqualTo: 'The email addresses do not match.' }
},
onfocusout: function (element) {
// if either of the email fields, immediately validate, otherwise let the normal behavior happen
switch ($(element).attr('id')) {
// validate these on focus lost
case 'txtPayorEmail':
case 'txtConfEmail':
case 'txtCCNumber':
case 'txtCCSecurityNum':
case 'txtCCZip':
case 'txtACHRoutingNum':
case 'txtACHAcctNum':
case 'txtACHZip':
$(element).valid();
break;
default:
$(element).valid();
// do nothing for the others, they get validated on form submit
break;
}
},
errorLabelContainer: $("#form1 div.error"),
ignore: ":hidden",
onkeyup: false
//,debug:true
});
});
function isCreditCard() {
return $('input[name=PayType][value=rbtCC]:checked').length > 0;
}
function isACH() {
return $('input[name=PayType][value=rbtACH]:checked').length > 0;
}
function isEmailed() {
return $('input[id=rbtEmailYes]:checked').length > 0;
}
更新：我現在已經在兩個瀏覽器（包括Firefox和Chrome）中嘗試了這一點，並且在兩個瀏覽器中，驗證不再在頁面上第二次運行。所以它不會似乎是一個FF特定錯誤，而是標準化的東西是我搞亂了......
更新＃2：偏偏歌劇& IE 8一樣，所以這是第3 & 4瀏覽器現在這樣做了。這絕對是我的設計的一個基本問題..
在我們的測試和生產網站上，這些都在https下運行，但在本地開發它只是http，兩種情況下都會出現問題。
我試着CTRL-F5在編輯時刷新頁面，但仍然存在相同的行爲。
我已經檢查了第一次和第二次通過Live HTTP標頭，並且在如何訪問該文件方面沒有可察覺的差異。所有的js文件都被加載兩次，服務器都響應HTTP/1.1 200 OK。
我的JavaScript文件在@Cos Callis提供的鏈接中引用與@Ganztoll相同，儘管他使用PHP並且我在.NET中，但基本上我沒有看到生成src目標動態與保留硬編碼是。瀏覽器應該看到完全相同的結果，並相應地對待它...我想我可以給它一個服務器端包括或一些東西..
任何其他幫助或解釋將不勝感激。
可能重複http://stackoverflow.com/questions/5936700/why-doesnt-jquery-的getJSON功能 - 執行 - 當-A-頁面被重定向，而不是-的。是的頁面是一個JSP而不是。aspx，但這個想法是通過使用response.redirect來改變相對路徑。 –
不知道它是否有所作爲，但有沒有一個特定的原因，你沒有使用最新版本的jQuery？ – Sparky
@ Sparky672沒有其他的具體原因，那就是我們現在在所有其他網站上使用的東西，我們沒有時間重新測試我們所有的網絡應用程序（許多＆複雜..）只是更新jQuery版本，我希望這樣做，但是必須等到我們進行了一些自動化測試以確保我們不會在這個過程中破壞某些東西。 –