Current state

This commit is contained in:
2026-02-07 08:23:18 +01:00
commit 0a4372c40d
22479 changed files with 1553543 additions and 0 deletions

View File

@@ -0,0 +1,833 @@
/*!
* jQuery Validation Plugin v1.12.0
*
* http://jqueryvalidation.org/
*
* Copyright (c) 2014 Jörn Zaefferer
* Released under the MIT license
*/
(function() {
function stripHtml(value) {
// remove html tags and space chars
return value.replace(/<.[^<>]*?>/g, " ").replace(/&nbsp;|&#160;/gi, " ")
// remove punctuation
.replace(/[.(),;:!?%#$'\"_+=\/\-“”’]*/g, "");
}
jQuery.validator.addMethod("maxWords", function(value, element, params) {
return this.optional(element) || stripHtml(value).match(/\b\w+\b/g).length <= params;
}, jQuery.validator.format("Please enter {0} words or less."));
jQuery.validator.addMethod("minWords", function(value, element, params) {
return this.optional(element) || stripHtml(value).match(/\b\w+\b/g).length >= params;
}, jQuery.validator.format("Please enter at least {0} words."));
jQuery.validator.addMethod("rangeWords", function(value, element, params) {
var valueStripped = stripHtml(value),
regex = /\b\w+\b/g;
return this.optional(element) || valueStripped.match(regex).length >= params[0] && valueStripped.match(regex).length <= params[1];
}, jQuery.validator.format("Please enter between {0} and {1} words."));
}());
// Accept a value from a file input based on a required mimetype
jQuery.validator.addMethod("accept", function(value, element, param) {
// Split mime on commas in case we have multiple types we can accept
var typeParam = typeof param === "string" ? param.replace(/\s/g, "").replace(/,/g, "|") : "image/*",
optionalValue = this.optional(element),
i, file;
// Element is optional
if (optionalValue) {
return optionalValue;
}
if (jQuery(element).attr("type") === "file") {
// If we are using a wildcard, make it regex friendly
typeParam = typeParam.replace(/\*/g, ".*");
// Check if the element has a FileList before checking each file
if (element.files && element.files.length) {
for (i = 0; i < element.files.length; i++) {
file = element.files[i];
// Grab the mimetype from the loaded file, verify it matches
if (!file.type.match(new RegExp( ".?(" + typeParam + ")$", "i"))) {
return false;
}
}
}
}
// Either return true because we've validated each file, or because the
// browser does not support element.files and the FileList feature
return true;
}, jQuery.validator.format("Please enter a value with a valid mimetype."));
jQuery.validator.addMethod("alphanumeric", function(value, element) {
return this.optional(element) || /^\w+$/i.test(value);
}, "Letters, numbers, and underscores only please");
/*
* Dutch bank account numbers (not 'giro' numbers) have 9 digits
* and pass the '11 check'.
* We accept the notation with spaces, as that is common.
* acceptable: 123456789 or 12 34 56 789
*/
jQuery.validator.addMethod("bankaccountNL", function(value, element) {
if (this.optional(element)) {
return true;
}
if (!(/^[0-9]{9}|([0-9]{2} ){3}[0-9]{3}$/.test(value))) {
return false;
}
// now '11 check'
var account = value.replace(/ /g, ""), // remove spaces
sum = 0,
len = account.length,
pos, factor, digit;
for ( pos = 0; pos < len; pos++ ) {
factor = len - pos;
digit = account.substring(pos, pos + 1);
sum = sum + factor * digit;
}
return sum % 11 === 0;
}, "Please specify a valid bank account number");
jQuery.validator.addMethod("bankorgiroaccountNL", function(value, element) {
return this.optional(element) ||
($.validator.methods.bankaccountNL.call(this, value, element)) ||
($.validator.methods.giroaccountNL.call(this, value, element));
}, "Please specify a valid bank or giro account number");
/**
* BIC is the business identifier code (ISO 9362). This BIC check is not a guarantee for authenticity.
*
* BIC pattern: BBBBCCLLbbb (8 or 11 characters long; bbb is optional)
*
* BIC definition in detail:
* - First 4 characters - bank code (only letters)
* - Next 2 characters - ISO 3166-1 alpha-2 country code (only letters)
* - Next 2 characters - location code (letters and digits)
* a. shall not start with '0' or '1'
* b. second character must be a letter ('O' is not allowed) or one of the following digits ('0' for test (therefore not allowed), '1' for passive participant and '2' for active participant)
* - Last 3 characters - branch code, optional (shall not start with 'X' except in case of 'XXX' for primary office) (letters and digits)
*/
jQuery.validator.addMethod("bic", function(value, element) {
return this.optional( element ) || /^([A-Z]{6}[A-Z2-9][A-NP-Z1-2])(X{3}|[A-WY-Z0-9][A-Z0-9]{2})?$/.test( value );
}, "Please specify a valid BIC code");
/*
* Código de identificación fiscal ( CIF ) is the tax identification code for Spanish legal entities
* Further rules can be found in Spanish on http://es.wikipedia.org/wiki/C%C3%B3digo_de_identificaci%C3%B3n_fiscal
*/
jQuery.validator.addMethod( "cifES", function( value ) {
"use strict";
var num = [],
controlDigit, sum, i, count, tmp, secondDigit;
value = value.toUpperCase();
// Quick format test
if ( !value.match( "((^[A-Z]{1}[0-9]{7}[A-Z0-9]{1}$|^[T]{1}[A-Z0-9]{8}$)|^[0-9]{8}[A-Z]{1}$)" ) ) {
return false;
}
for ( i = 0; i < 9; i++ ) {
num[ i ] = parseInt( value.charAt( i ), 10 );
}
// Algorithm for checking CIF codes
sum = num[ 2 ] + num[ 4 ] + num[ 6 ];
for ( count = 1; count < 8; count += 2 ) {
tmp = ( 2 * num[ count ] ).toString();
secondDigit = tmp.charAt( 1 );
sum += parseInt( tmp.charAt( 0 ), 10 ) + ( secondDigit === "" ? 0 : parseInt( secondDigit, 10 ) );
}
/* The first (position 1) is a letter following the following criteria:
* A. Corporations
* B. LLCs
* C. General partnerships
* D. Companies limited partnerships
* E. Communities of goods
* F. Cooperative Societies
* G. Associations
* H. Communities of homeowners in horizontal property regime
* J. Civil Societies
* K. Old format
* L. Old format
* M. Old format
* N. Nonresident entities
* P. Local authorities
* Q. Autonomous bodies, state or not, and the like, and congregations and religious institutions
* R. Congregations and religious institutions (since 2008 ORDER EHA/451/2008)
* S. Organs of State Administration and regions
* V. Agrarian Transformation
* W. Permanent establishments of non-resident in Spain
*/
if ( /^[ABCDEFGHJNPQRSUVW]{1}/.test( value ) ) {
sum += "";
controlDigit = 10 - parseInt( sum.charAt( sum.length - 1 ), 10 );
value += controlDigit;
return ( num[ 8 ].toString() === String.fromCharCode( 64 + controlDigit ) || num[ 8 ].toString() === value.charAt( value.length - 1 ) );
}
return false;
}, "Please specify a valid CIF number." );
/* NOTICE: Modified version of Castle.Components.Validator.CreditCardValidator
* Redistributed under the the Apache License 2.0 at http://www.apache.org/licenses/LICENSE-2.0
* Valid Types: mastercard, visa, amex, dinersclub, enroute, discover, jcb, unknown, all (overrides all other settings)
*/
jQuery.validator.addMethod("creditcardtypes", function(value, element, param) {
if (/[^0-9\-]+/.test(value)) {
return false;
}
value = value.replace(/\D/g, "");
var validTypes = 0x0000;
if (param.mastercard) {
validTypes |= 0x0001;
}
if (param.visa) {
validTypes |= 0x0002;
}
if (param.amex) {
validTypes |= 0x0004;
}
if (param.dinersclub) {
validTypes |= 0x0008;
}
if (param.enroute) {
validTypes |= 0x0010;
}
if (param.discover) {
validTypes |= 0x0020;
}
if (param.jcb) {
validTypes |= 0x0040;
}
if (param.unknown) {
validTypes |= 0x0080;
}
if (param.all) {
validTypes = 0x0001 | 0x0002 | 0x0004 | 0x0008 | 0x0010 | 0x0020 | 0x0040 | 0x0080;
}
if (validTypes & 0x0001 && /^(5[12345])/.test(value)) { //mastercard
return value.length === 16;
}
if (validTypes & 0x0002 && /^(4)/.test(value)) { //visa
return value.length === 16;
}
if (validTypes & 0x0004 && /^(3[47])/.test(value)) { //amex
return value.length === 15;
}
if (validTypes & 0x0008 && /^(3(0[012345]|[68]))/.test(value)) { //dinersclub
return value.length === 14;
}
if (validTypes & 0x0010 && /^(2(014|149))/.test(value)) { //enroute
return value.length === 15;
}
if (validTypes & 0x0020 && /^(6011)/.test(value)) { //discover
return value.length === 16;
}
if (validTypes & 0x0040 && /^(3)/.test(value)) { //jcb
return value.length === 16;
}
if (validTypes & 0x0040 && /^(2131|1800)/.test(value)) { //jcb
return value.length === 15;
}
if (validTypes & 0x0080) { //unknown
return true;
}
return false;
}, "Please enter a valid credit card number.");
/**
* Validates currencies with any given symbols by @jameslouiz
* Symbols can be optional or required. Symbols required by default
*
* Usage examples:
* currency: ["£", false] - Use false for soft currency validation
* currency: ["$", false]
* currency: ["RM", false] - also works with text based symbols such as "RM" - Malaysia Ringgit etc
*
* <input class="currencyInput" name="currencyInput">
*
* Soft symbol checking
* currencyInput: {
* currency: ["$", false]
* }
*
* Strict symbol checking (default)
* currencyInput: {
* currency: "$"
* //OR
* currency: ["$", true]
* }
*
* Multiple Symbols
* currencyInput: {
* currency: "$,£,¢"
* }
*/
jQuery.validator.addMethod("currency", function(value, element, param) {
var isParamString = typeof param === "string",
symbol = isParamString ? param : param[0],
soft = isParamString ? true : param[1],
regex;
symbol = symbol.replace(/,/g, "");
symbol = soft ? symbol + "]" : symbol + "]?";
regex = "^[" + symbol + "([1-9]{1}[0-9]{0,2}(\\,[0-9]{3})*(\\.[0-9]{0,2})?|[1-9]{1}[0-9]{0,}(\\.[0-9]{0,2})?|0(\\.[0-9]{0,2})?|(\\.[0-9]{1,2})?)$";
regex = new RegExp(regex);
return this.optional(element) || regex.test(value);
}, "Please specify a valid currency");
/**
* Return true, if the value is a valid date, also making this formal check dd/mm/yyyy.
*
* @example jQuery.validator.methods.date("01/01/1900")
* @result true
*
* @example jQuery.validator.methods.date("01/13/1990")
* @result false
*
* @example jQuery.validator.methods.date("01.01.1900")
* @result false
*
* @example <input name="pippo" class="{dateITA:true}" />
* @desc Declares an optional input element whose value must be a valid date.
*
* @name jQuery.validator.methods.dateITA
* @type Boolean
* @cat Plugins/Validate/Methods
*/
jQuery.validator.addMethod("dateITA", function(value, element) {
var check = false,
re = /^\d{1,2}\/\d{1,2}\/\d{4}$/,
adata, gg, mm, aaaa, xdata;
if ( re.test(value)) {
adata = value.split("/");
gg = parseInt(adata[0],10);
mm = parseInt(adata[1],10);
aaaa = parseInt(adata[2],10);
xdata = new Date(aaaa, mm - 1, gg, 12, 0, 0, 0);
if ( ( xdata.getFullYear() === aaaa ) && ( xdata.getMonth() === mm - 1 ) && ( xdata.getDate() === gg ) ){
check = true;
} else {
check = false;
}
} else {
check = false;
}
return this.optional(element) || check;
}, "Please enter a correct date");
jQuery.validator.addMethod("dateNL", function(value, element) {
return this.optional(element) || /^(0?[1-9]|[12]\d|3[01])[\.\/\-](0?[1-9]|1[012])[\.\/\-]([12]\d)?(\d\d)$/.test(value);
}, "Please enter a correct date");
// Older "accept" file extension method. Old docs: http://docs.jquery.com/Plugins/Validation/Methods/accept
jQuery.validator.addMethod("extension", function(value, element, param) {
param = typeof param === "string" ? param.replace(/,/g, "|") : "png|jpe?g|gif";
return this.optional(element) || value.match(new RegExp(".(" + param + ")$", "i"));
}, jQuery.validator.format("Please enter a value with a valid extension."));
/**
* Dutch giro account numbers (not bank numbers) have max 7 digits
*/
jQuery.validator.addMethod("giroaccountNL", function(value, element) {
return this.optional(element) || /^[0-9]{1,7}$/.test(value);
}, "Please specify a valid giro account number");
/**
* IBAN is the international bank account number.
* It has a country - specific format, that is checked here too
*/
jQuery.validator.addMethod("iban", function(value, element) {
// some quick simple tests to prevent needless work
if (this.optional(element)) {
return true;
}
// remove spaces and to upper case
var iban = value.replace(/ /g,"").toUpperCase(),
ibancheckdigits = "",
leadingZeroes = true,
cRest = "",
cOperator = "",
countrycode, ibancheck, charAt, cChar, bbanpattern, bbancountrypatterns, ibanregexp, i, p;
if (!(/^([a-zA-Z0-9]{4} ){2,8}[a-zA-Z0-9]{1,4}|[a-zA-Z0-9]{12,34}$/.test(iban))) {
return false;
}
// check the country code and find the country specific format
countrycode = iban.substring(0,2);
bbancountrypatterns = {
"AL": "\\d{8}[\\dA-Z]{16}",
"AD": "\\d{8}[\\dA-Z]{12}",
"AT": "\\d{16}",
"AZ": "[\\dA-Z]{4}\\d{20}",
"BE": "\\d{12}",
"BH": "[A-Z]{4}[\\dA-Z]{14}",
"BA": "\\d{16}",
"BR": "\\d{23}[A-Z][\\dA-Z]",
"BG": "[A-Z]{4}\\d{6}[\\dA-Z]{8}",
"CR": "\\d{17}",
"HR": "\\d{17}",
"CY": "\\d{8}[\\dA-Z]{16}",
"CZ": "\\d{20}",
"DK": "\\d{14}",
"DO": "[A-Z]{4}\\d{20}",
"EE": "\\d{16}",
"FO": "\\d{14}",
"FI": "\\d{14}",
"FR": "\\d{10}[\\dA-Z]{11}\\d{2}",
"GE": "[\\dA-Z]{2}\\d{16}",
"DE": "\\d{18}",
"GI": "[A-Z]{4}[\\dA-Z]{15}",
"GR": "\\d{7}[\\dA-Z]{16}",
"GL": "\\d{14}",
"GT": "[\\dA-Z]{4}[\\dA-Z]{20}",
"HU": "\\d{24}",
"IS": "\\d{22}",
"IE": "[\\dA-Z]{4}\\d{14}",
"IL": "\\d{19}",
"IT": "[A-Z]\\d{10}[\\dA-Z]{12}",
"KZ": "\\d{3}[\\dA-Z]{13}",
"KW": "[A-Z]{4}[\\dA-Z]{22}",
"LV": "[A-Z]{4}[\\dA-Z]{13}",
"LB": "\\d{4}[\\dA-Z]{20}",
"LI": "\\d{5}[\\dA-Z]{12}",
"LT": "\\d{16}",
"LU": "\\d{3}[\\dA-Z]{13}",
"MK": "\\d{3}[\\dA-Z]{10}\\d{2}",
"MT": "[A-Z]{4}\\d{5}[\\dA-Z]{18}",
"MR": "\\d{23}",
"MU": "[A-Z]{4}\\d{19}[A-Z]{3}",
"MC": "\\d{10}[\\dA-Z]{11}\\d{2}",
"MD": "[\\dA-Z]{2}\\d{18}",
"ME": "\\d{18}",
"NL": "[A-Z]{4}\\d{10}",
"NO": "\\d{11}",
"PK": "[\\dA-Z]{4}\\d{16}",
"PS": "[\\dA-Z]{4}\\d{21}",
"PL": "\\d{24}",
"PT": "\\d{21}",
"RO": "[A-Z]{4}[\\dA-Z]{16}",
"SM": "[A-Z]\\d{10}[\\dA-Z]{12}",
"SA": "\\d{2}[\\dA-Z]{18}",
"RS": "\\d{18}",
"SK": "\\d{20}",
"SI": "\\d{15}",
"ES": "\\d{20}",
"SE": "\\d{20}",
"CH": "\\d{5}[\\dA-Z]{12}",
"TN": "\\d{20}",
"TR": "\\d{5}[\\dA-Z]{17}",
"AE": "\\d{3}\\d{16}",
"GB": "[A-Z]{4}\\d{14}",
"VG": "[\\dA-Z]{4}\\d{16}"
};
bbanpattern = bbancountrypatterns[countrycode];
// As new countries will start using IBAN in the
// future, we only check if the countrycode is known.
// This prevents false negatives, while almost all
// false positives introduced by this, will be caught
// by the checksum validation below anyway.
// Strict checking should return FALSE for unknown
// countries.
if (typeof bbanpattern !== "undefined") {
ibanregexp = new RegExp("^[A-Z]{2}\\d{2}" + bbanpattern + "$", "");
if (!(ibanregexp.test(iban))) {
return false; // invalid country specific format
}
}
// now check the checksum, first convert to digits
ibancheck = iban.substring(4,iban.length) + iban.substring(0,4);
for (i = 0; i < ibancheck.length; i++) {
charAt = ibancheck.charAt(i);
if (charAt !== "0") {
leadingZeroes = false;
}
if (!leadingZeroes) {
ibancheckdigits += "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ".indexOf(charAt);
}
}
// calculate the result of: ibancheckdigits % 97
for (p = 0; p < ibancheckdigits.length; p++) {
cChar = ibancheckdigits.charAt(p);
cOperator = "" + cRest + "" + cChar;
cRest = cOperator % 97;
}
return cRest === 1;
}, "Please specify a valid IBAN");
jQuery.validator.addMethod("integer", function(value, element) {
return this.optional(element) || /^-?\d+$/.test(value);
}, "A positive or negative non-decimal number please");
jQuery.validator.addMethod("ipv4", function(value, element) {
return this.optional(element) || /^(25[0-5]|2[0-4]\d|[01]?\d\d?)\.(25[0-5]|2[0-4]\d|[01]?\d\d?)\.(25[0-5]|2[0-4]\d|[01]?\d\d?)\.(25[0-5]|2[0-4]\d|[01]?\d\d?)$/i.test(value);
}, "Please enter a valid IP v4 address.");
jQuery.validator.addMethod("ipv6", function(value, element) {
return this.optional(element) || /^((([0-9A-Fa-f]{1,4}:){7}[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){6}:[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){5}:([0-9A-Fa-f]{1,4}:)?[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){4}:([0-9A-Fa-f]{1,4}:){0,2}[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){3}:([0-9A-Fa-f]{1,4}:){0,3}[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){2}:([0-9A-Fa-f]{1,4}:){0,4}[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){6}((\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b)\.){3}(\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b))|(([0-9A-Fa-f]{1,4}:){0,5}:((\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b)\.){3}(\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b))|(::([0-9A-Fa-f]{1,4}:){0,5}((\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b)\.){3}(\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b))|([0-9A-Fa-f]{1,4}::([0-9A-Fa-f]{1,4}:){0,5}[0-9A-Fa-f]{1,4})|(::([0-9A-Fa-f]{1,4}:){0,6}[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){1,7}:))$/i.test(value);
}, "Please enter a valid IP v6 address.");
jQuery.validator.addMethod("lettersonly", function(value, element) {
return this.optional(element) || /^[a-z]+$/i.test(value);
}, "Letters only please");
jQuery.validator.addMethod("letterswithbasicpunc", function(value, element) {
return this.optional(element) || /^[a-z\-.,()'"\s]+$/i.test(value);
}, "Letters or punctuation only please");
jQuery.validator.addMethod("mobileNL", function(value, element) {
return this.optional(element) || /^((\+|00(\s|\s?\-\s?)?)31(\s|\s?\-\s?)?(\(0\)[\-\s]?)?|0)6((\s|\s?\-\s?)?[0-9]){8}$/.test(value);
}, "Please specify a valid mobile number");
/* For UK phone functions, do the following server side processing:
* Compare original input with this RegEx pattern:
* ^\(?(?:(?:00\)?[\s\-]?\(?|\+)(44)\)?[\s\-]?\(?(?:0\)?[\s\-]?\(?)?|0)([1-9]\d{1,4}\)?[\s\d\-]+)$
* Extract $1 and set $prefix to '+44<space>' if $1 is '44', otherwise set $prefix to '0'
* Extract $2 and remove hyphens, spaces and parentheses. Phone number is combined $prefix and $2.
* A number of very detailed GB telephone number RegEx patterns can also be found at:
* http://www.aa-asterisk.org.uk/index.php/Regular_Expressions_for_Validating_and_Formatting_GB_Telephone_Numbers
*/
jQuery.validator.addMethod("mobileUK", function(phone_number, element) {
phone_number = phone_number.replace(/\(|\)|\s+|-/g, "");
return this.optional(element) || phone_number.length > 9 &&
phone_number.match(/^(?:(?:(?:00\s?|\+)44\s?|0)7(?:[1345789]\d{2}|624)\s?\d{3}\s?\d{3})$/);
}, "Please specify a valid mobile number");
/*
* The número de identidad de extranjero ( NIE )is a code used to identify the non-nationals in Spain
*/
jQuery.validator.addMethod( "nieES", function( value ) {
"use strict";
value = value.toUpperCase();
// Basic format test
if ( !value.match( "((^[A-Z]{1}[0-9]{7}[A-Z0-9]{1}$|^[T]{1}[A-Z0-9]{8}$)|^[0-9]{8}[A-Z]{1}$)" ) ) {
return false;
}
// Test NIE
//T
if ( /^[T]{1}/.test( value ) ) {
return ( value[ 8 ] === /^[T]{1}[A-Z0-9]{8}$/.test( value ) );
}
//XYZ
if ( /^[XYZ]{1}/.test( value ) ) {
return (
value[ 8 ] === "TRWAGMYFPDXBNJZSQVHLCKE".charAt(
value.replace( "X", "0" )
.replace( "Y", "1" )
.replace( "Z", "2" )
.substring( 0, 8 ) % 23
)
);
}
return false;
}, "Please specify a valid NIE number." );
/*
* The Número de Identificación Fiscal ( NIF ) is the way tax identification used in Spain for individuals
*/
jQuery.validator.addMethod( "nifES", function( value ) {
"use strict";
value = value.toUpperCase();
// Basic format test
if ( !value.match("((^[A-Z]{1}[0-9]{7}[A-Z0-9]{1}$|^[T]{1}[A-Z0-9]{8}$)|^[0-9]{8}[A-Z]{1}$)") ) {
return false;
}
// Test NIF
if ( /^[0-9]{8}[A-Z]{1}$/.test( value ) ) {
return ( "TRWAGMYFPDXBNJZSQVHLCKE".charAt( value.substring( 8, 0 ) % 23 ) === value.charAt( 8 ) );
}
// Test specials NIF (starts with K, L or M)
if ( /^[KLM]{1}/.test( value ) ) {
return ( value[ 8 ] === String.fromCharCode( 64 ) );
}
return false;
}, "Please specify a valid NIF number." );
jQuery.validator.addMethod("nowhitespace", function(value, element) {
return this.optional(element) || /^\S+$/i.test(value);
}, "No white space please");
/**
* Return true if the field value matches the given format RegExp
*
* @example jQuery.validator.methods.pattern("AR1004",element,/^AR\d{4}$/)
* @result true
*
* @example jQuery.validator.methods.pattern("BR1004",element,/^AR\d{4}$/)
* @result false
*
* @name jQuery.validator.methods.pattern
* @type Boolean
* @cat Plugins/Validate/Methods
*/
jQuery.validator.addMethod("pattern", function(value, element, param) {
if (this.optional(element)) {
return true;
}
if (typeof param === "string") {
param = new RegExp(param);
}
return param.test(value);
}, "Invalid format.");
/**
* Dutch phone numbers have 10 digits (or 11 and start with +31).
*/
jQuery.validator.addMethod("phoneNL", function(value, element) {
return this.optional(element) || /^((\+|00(\s|\s?\-\s?)?)31(\s|\s?\-\s?)?(\(0\)[\-\s]?)?|0)[1-9]((\s|\s?\-\s?)?[0-9]){8}$/.test(value);
}, "Please specify a valid phone number.");
/* For UK phone functions, do the following server side processing:
* Compare original input with this RegEx pattern:
* ^\(?(?:(?:00\)?[\s\-]?\(?|\+)(44)\)?[\s\-]?\(?(?:0\)?[\s\-]?\(?)?|0)([1-9]\d{1,4}\)?[\s\d\-]+)$
* Extract $1 and set $prefix to '+44<space>' if $1 is '44', otherwise set $prefix to '0'
* Extract $2 and remove hyphens, spaces and parentheses. Phone number is combined $prefix and $2.
* A number of very detailed GB telephone number RegEx patterns can also be found at:
* http://www.aa-asterisk.org.uk/index.php/Regular_Expressions_for_Validating_and_Formatting_GB_Telephone_Numbers
*/
jQuery.validator.addMethod("phoneUK", function(phone_number, element) {
phone_number = phone_number.replace(/\(|\)|\s+|-/g, "");
return this.optional(element) || phone_number.length > 9 &&
phone_number.match(/^(?:(?:(?:00\s?|\+)44\s?)|(?:\(?0))(?:\d{2}\)?\s?\d{4}\s?\d{4}|\d{3}\)?\s?\d{3}\s?\d{3,4}|\d{4}\)?\s?(?:\d{5}|\d{3}\s?\d{3})|\d{5}\)?\s?\d{4,5})$/);
}, "Please specify a valid phone number");
/**
* matches US phone number format
*
* where the area code may not start with 1 and the prefix may not start with 1
* allows '-' or ' ' as a separator and allows parens around area code
* some people may want to put a '1' in front of their number
*
* 1(212)-999-2345 or
* 212 999 2344 or
* 212-999-0983
*
* but not
* 111-123-5434
* and not
* 212 123 4567
*/
jQuery.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]([02-9]\d|1[02-9])\)|[2-9]([02-9]\d|1[02-9]))-?[2-9]([02-9]\d|1[02-9])-?\d{4}$/);
}, "Please specify a valid phone number");
/* For UK phone functions, do the following server side processing:
* Compare original input with this RegEx pattern:
* ^\(?(?:(?:00\)?[\s\-]?\(?|\+)(44)\)?[\s\-]?\(?(?:0\)?[\s\-]?\(?)?|0)([1-9]\d{1,4}\)?[\s\d\-]+)$
* Extract $1 and set $prefix to '+44<space>' if $1 is '44', otherwise set $prefix to '0'
* Extract $2 and remove hyphens, spaces and parentheses. Phone number is combined $prefix and $2.
* A number of very detailed GB telephone number RegEx patterns can also be found at:
* http://www.aa-asterisk.org.uk/index.php/Regular_Expressions_for_Validating_and_Formatting_GB_Telephone_Numbers
*/
//Matches UK landline + mobile, accepting only 01-3 for landline or 07 for mobile to exclude many premium numbers
jQuery.validator.addMethod("phonesUK", function(phone_number, element) {
phone_number = phone_number.replace(/\(|\)|\s+|-/g, "");
return this.optional(element) || phone_number.length > 9 &&
phone_number.match(/^(?:(?:(?:00\s?|\+)44\s?|0)(?:1\d{8,9}|[23]\d{9}|7(?:[1345789]\d{8}|624\d{6})))$/);
}, "Please specify a valid uk phone number");
jQuery.validator.addMethod("postalcodeNL", function(value, element) {
return this.optional(element) || /^[1-9][0-9]{3}\s?[a-zA-Z]{2}$/.test(value);
}, "Please specify a valid postal code");
// Matches UK postcode. Does not match to UK Channel Islands that have their own postcodes (non standard UK)
jQuery.validator.addMethod("postcodeUK", function(value, element) {
return this.optional(element) || /^((([A-PR-UWYZ][0-9])|([A-PR-UWYZ][0-9][0-9])|([A-PR-UWYZ][A-HK-Y][0-9])|([A-PR-UWYZ][A-HK-Y][0-9][0-9])|([A-PR-UWYZ][0-9][A-HJKSTUW])|([A-PR-UWYZ][A-HK-Y][0-9][ABEHMNPRVWXY]))\s?([0-9][ABD-HJLNP-UW-Z]{2})|(GIR)\s?(0AA))$/i.test(value);
}, "Please specify a valid UK postcode");
/*
* Lets you say "at least X inputs that match selector Y must be filled."
*
* The end result is that neither of these inputs:
*
* <input class="productinfo" name="partnumber">
* <input class="productinfo" name="description">
*
* ...will validate unless at least one of them is filled.
*
* partnumber: {require_from_group: [1,".productinfo"]},
* description: {require_from_group: [1,".productinfo"]}
*
* options[0]: number of fields that must be filled in the group
* options[1]: CSS selector that defines the group of conditionally required fields
*/
jQuery.validator.addMethod("require_from_group", function(value, element, options) {
var $fields = $(options[1], element.form),
$fieldsFirst = $fields.eq(0),
validator = $fieldsFirst.data("valid_req_grp") ? $fieldsFirst.data("valid_req_grp") : $.extend({}, this),
isValid = $fields.filter(function() {
return validator.elementValue(this);
}).length >= options[0];
// Store the cloned validator for future validation
$fieldsFirst.data("valid_req_grp", validator);
// If element isn't being validated, run each require_from_group field's validation rules
if (!$(element).data("being_validated")) {
$fields.data("being_validated", true);
$fields.each(function() {
validator.element(this);
});
$fields.data("being_validated", false);
}
return isValid;
}, jQuery.validator.format("Please fill at least {0} of these fields."));
/*
* Lets you say "either at least X inputs that match selector Y must be filled,
* OR they must all be skipped (left blank)."
*
* The end result, is that none of these inputs:
*
* <input class="productinfo" name="partnumber">
* <input class="productinfo" name="description">
* <input class="productinfo" name="color">
*
* ...will validate unless either at least two of them are filled,
* OR none of them are.
*
* partnumber: {skip_or_fill_minimum: [2,".productinfo"]},
* description: {skip_or_fill_minimum: [2,".productinfo"]},
* color: {skip_or_fill_minimum: [2,".productinfo"]}
*
* options[0]: number of fields that must be filled in the group
* options[1]: CSS selector that defines the group of conditionally required fields
*
*/
jQuery.validator.addMethod("skip_or_fill_minimum", function(value, element, options) {
var $fields = $(options[1], element.form),
$fieldsFirst = $fields.eq(0),
validator = $fieldsFirst.data("valid_skip") ? $fieldsFirst.data("valid_skip") : $.extend({}, this),
numberFilled = $fields.filter(function() {
return validator.elementValue(this);
}).length,
isValid = numberFilled === 0 || numberFilled >= options[0];
// Store the cloned validator for future validation
$fieldsFirst.data("valid_skip", validator);
// If element isn't being validated, run each skip_or_fill_minimum field's validation rules
if (!$(element).data("being_validated")) {
$fields.data("being_validated", true);
$fields.each(function() {
validator.element(this);
});
$fields.data("being_validated", false);
}
return isValid;
}, jQuery.validator.format("Please either skip these fields or fill at least {0} of them."));
// TODO check if value starts with <, otherwise don't try stripping anything
jQuery.validator.addMethod("strippedminlength", function(value, element, param) {
return jQuery(value).text().length >= param;
}, jQuery.validator.format("Please enter at least {0} characters"));
jQuery.validator.addMethod("time", function(value, element) {
return this.optional(element) || /^([01]\d|2[0-3])(:[0-5]\d){1,2}$/.test(value);
}, "Please enter a valid time, between 00:00 and 23:59");
jQuery.validator.addMethod("time12h", function(value, element) {
return this.optional(element) || /^((0?[1-9]|1[012])(:[0-5]\d){1,2}(\ ?[AP]M))$/i.test(value);
}, "Please enter a valid time in 12-hour am/pm format");
// same as url, but TLD is optional
jQuery.validator.addMethod("url2", function(value, element) {
return this.optional(element) || /^(https?|ftp):\/\/(((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:)*@)?(((\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5]))|((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)*(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?)(:\d*)?)(\/((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)?)?(\?((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|[\uE000-\uF8FF]|\/|\?)*)?(#((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|\/|\?)*)?$/i.test(value);
}, jQuery.validator.messages.url);
/**
* Return true, if the value is a valid vehicle identification number (VIN).
*
* Works with all kind of text inputs.
*
* @example <input type="text" size="20" name="VehicleID" class="{required:true,vinUS:true}" />
* @desc Declares a required input element whose value must be a valid vehicle identification number.
*
* @name jQuery.validator.methods.vinUS
* @type Boolean
* @cat Plugins/Validate/Methods
*/
jQuery.validator.addMethod("vinUS", function(v) {
if (v.length !== 17) {
return false;
}
var LL = [ "A", "B", "C", "D", "E", "F", "G", "H", "J", "K", "L", "M", "N", "P", "R", "S", "T", "U", "V", "W", "X", "Y", "Z" ],
VL = [ 1, 2, 3, 4, 5, 6, 7, 8, 1, 2, 3, 4, 5, 7, 9, 2, 3, 4, 5, 6, 7, 8, 9 ],
FL = [ 8, 7, 6, 5, 4, 3, 2, 10, 0, 9, 8, 7, 6, 5, 4, 3, 2 ],
rs = 0,
i, n, d, f, cd, cdv;
for (i = 0; i < 17; i++){
f = FL[i];
d = v.slice(i,i + 1);
if (i === 8) {
cdv = d;
}
if (!isNaN(d)) {
d *= f;
} else {
for (n = 0; n < LL.length; n++) {
if (d.toUpperCase() === LL[n]) {
d = VL[n];
d *= f;
if (isNaN(cdv) && n === 8) {
cdv = LL[n];
}
break;
}
}
}
rs += d;
}
cd = rs % 11;
if (cd === 10) {
cd = "X";
}
if (cd === cdv) {
return true;
}
return false;
}, "The specified vehicle identification number (VIN) is invalid.");
jQuery.validator.addMethod("zipcodeUS", function(value, element) {
return this.optional(element) || /^\d{5}-\d{4}$|^\d{5}$/.test(value);
}, "The specified US ZIP Code is invalid");
jQuery.validator.addMethod("ziprange", function(value, element) {
return this.optional(element) || /^90[2-5]\d\{2\}-\d{4}$/.test(value);
}, "Your ZIP-code must be in the range 902xx-xxxx to 905-xx-xxxx");

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,94 @@
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Test for jQuery validate() plugin</title>
<link rel="stylesheet" type="text/css" media="screen" href="css/screen.css" />
<style type="text/css">
.warning { color: red; }
</style>
<script src="../lib/jquery.js"></script>
<script src="../lib/jquery.mockjax.js"></script>
<script src="../lib/jquery.form.js"></script>
<script src="../dist/jquery.validate.js"></script>
<script type="text/javascript">
jQuery(function() {
$.mockjax({
url: "login.action",
response: function(settings) {
var user = settings.data.match( /user=(.+?)($|&)/ )[ 1 ],
password = settings.data.match( /password=(.+?)($|&)/ )[ 1 ];
if ( password !== "foobar" ) {
this.responseText = "Your password is wrong (must be foobar).";
return;
}
this.responseText = "Hi " + user + ", welcome back.";
},
responseStatus: 200,
responseTime: 500
});
// show a simple loading indicator
var loader = jQuery('<div id="loader"><img src="images/loading.gif" alt="loading..." /></div>')
.css({position: "relative", top: "1em", left: "25em", display: "inline"})
.appendTo("body")
.hide();
jQuery().ajaxStart(function() {
loader.show();
}).ajaxStop(function() {
loader.hide();
}).ajaxError(function(a, b, e) {
throw e;
});
var v = jQuery("#form").validate({
submitHandler: function(form) {
jQuery(form).ajaxSubmit({
target: "#result"
});
}
});
jQuery("#reset").click(function() {
v.resetForm();
});
});
</script>
</head>
<body>
<h1 id="banner"><a href="http://bassistance.de/jquery-plugins/jquery-plugin-validation/">jQuery Validation Plugin</a> Demo</h1>
<div id="main">
<form method="post" class="cmxform" id="form" action="login.action">
<fieldset>
<legend>Login Form (Enter "foobar" as password)</legend>
<p>
<label for="user">Username</label>
<input id="user" name="user" title="Please enter your username (at least 3 characters)" class="required" minlength="3" />
</p>
<p>
<label for="pass">Password</label>
<input type="password" name="password" id="password" class="required" minlength"5" />
</p>
<p>
<input class="submit" type="submit" value="Login"/>
</p>
</fieldset>
</form>
<div id="result" class="warning">Please login!</div>
<br/>
<button id="reset">Programmatically reset above form!</button>
<a href="index.html">Back to main page</a>
</div>
</body>
</html>

View File

@@ -0,0 +1,27 @@
$(function(){
$("#refreshimg").click(function(){
$.post('newsession.php');
$("#captchaimage").load('image_req.php');
return false;
});
$("#captchaform").validate({
rules: {
captcha: {
required: true,
remote: "process.php"
}
},
messages: {
captcha: "Correct captcha is required. Click the captcha to generate a new one"
},
submitHandler: function() {
alert("Correct captcha!");
},
success: function(label) {
label.addClass("valid").text("Valid captcha!")
},
onkeyup: false
});
});

View File

@@ -0,0 +1,6 @@
<?php
// Echo the image - timestamp appended to prevent caching
echo '<a href="index.php" onclick="refreshimg(); return false;" title="Click to refresh image"><img src="images/image.jpg?' . time() . '" width="132" height="46" alt="Captcha image" /></a>';
?>

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@@ -0,0 +1,35 @@
<?php
// Begin the session
session_start();
// If the session is not present, set the variable to an error message
if(!isset($_SESSION['captcha_id']))
$str = 'ERROR!';
// Else if it is present, set the variable to the session contents
else
$str = $_SESSION['captcha_id'];
// Set the content type
//header('Content-type: image/png');
header('Cache-control: no-cache');
// Create an image from button.png
$image = imagecreatefrompng('button.png');
// Set the font colour
$colour = imagecolorallocate($image, 183, 178, 152);
// Set the font
$font = '../fonts/Anorexia.ttf';
// Set a random integer for the rotation between -15 and 15 degrees
$rotate = rand(-15, 15);
// Create an image using our original image and adding the detail
imagettftext($image, 14, $rotate, 18, 30, $colour, $font, $str);
// Output the image as a png
imagepng($image);
?>

View File

@@ -0,0 +1,66 @@
<?php
// Make the page validate
ini_set('session.use_trans_sid', '0');
// Include the random string file
require 'rand.php';
// Begin the session
session_start();
// Set the session contents
$_SESSION['captcha_id'] = $str;
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>AJAX CAPTCHA</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="keywords" content="AJAX,JHR,PHP,CAPTCHA,download,PHP CAPTCHA,AJAX CAPTCHA,AJAX PHP CAPTCHA,download AJAX CAPTCHA,download AJAX PHP CAPTCHA" />
<meta name="description" content="An AJAX CAPTCHA script, written in PHP" />
<script type="text/javascript" src="../../lib/jquery.js"></script>
<script type="text/javascript" src="../../jquery.validate.js"></script>
<script type="text/javascript" src="captcha.js"></script>
<link rel="stylesheet" type="text/css" href="style.css" />
<style type="text/css">
img { border: 1px solid #eee; }
p#statusgreen { font-size: 1.2em; background-color: #fff; color: #0a0; }
p#statusred { font-size: 1.2em; background-color: #fff; color: #a00; }
fieldset label { display: block; }
fieldset div#captchaimage { float: left; margin-right: 15px; }
fieldset input#captcha { width: 25%; border: 1px solid #ddd; padding: 2px; }
fieldset input#submit { display: block; margin: 2% 0% 0% 0%; }
#captcha.success {
border: 1px solid #49c24f;
background: #bcffbf;
}
#captcha.error {
border: 1px solid #c24949;
background: #ffbcbc;
}
</style>
</head>
<body>
<h1><acronym title="Asynchronous JavaScript And XML">AJAX</acronym> <acronym title="Completely Automated Public Turing test to tell Computers and Humans Apart">CAPTCHA</acronym>, based on <a href="http://psyrens.com/captcha/">http://psyrens.com/captcha/</a></h1>
<form id="captchaform" action="">
<fieldset>
<div id="captchaimage"><a href="<?php echo $_SERVER['PHP_SELF']; ?>" id="refreshimg" title="Click to refresh image"><img src="images/image.php?<?php echo time(); ?>" width="132" height="46" alt="Captcha image" /></a></div>
<label for="captcha">Enter the characters as seen on the image above (case insensitive):</label>
<input type="text" maxlength="6" name="captcha" id="captcha" />
<input type="submit" name="submit" id="submit" value="Check" />
</fieldset>
</form>
<p>If you can&#39;t decipher the text on the image, click it to dynamically generate a new one.</p>
</body>
</html>

View File

@@ -0,0 +1,12 @@
<?php
// Include the random string file
require 'rand.php';
// Begin a new session
session_start();
// Set the session contents
$_SESSION['captcha_id'] = $str;
?>

View File

@@ -0,0 +1,14 @@
<?php
// Begin the session
session_start();
// To avoid case conflicts, make the input uppercase and check against the session value
// If it's correct, echo '1' as a string
if(strtoupper($_GET['captcha']) == $_SESSION['captcha_id'])
echo 'true';
// Else echo '0' as a string
else
echo 'false';
?>

View File

@@ -0,0 +1,11 @@
<?php
// Create a random string, leaving out 'o' to avoid confusion with '0'
$char = strtoupper(substr(str_shuffle('abcdefghjkmnpqrstuvwxyz'), 0, 4));
// Concatenate the random string onto the random numbers
// The font 'Anorexia' doesn't have a character for '8', so the numbers will only go up to 7
// '0' is left out to avoid confusion with 'O'
$str = rand(1, 7) . rand(1, 7) . $char;
?>

View File

@@ -0,0 +1,140 @@
body {
margin: 3% 5%;
padding: 0;
background-color: #fff;
color: #333;
font: 0.9em/1.3 Helvetica, Arial, Verdana, Sans-serif;
}
a:link, a:visited {
background-color: #fff;
color: #333;
text-decoration: underline;
}
a:hover, a:focus, a:active {
background-color: #ffb;
color: #454545;
text-decoration: underline;
}
h1 {
margin: 2% 0%;
padding: 1%;
border-bottom: 1px solid #ddd;
background-color: #f8f8f8;
color: #666;
font: normal 1.5em Helvetica, Arial, Verdana, Sans-serif;
}
h2 {
margin: 2% 0%;
padding: 1%;
border-bottom: 1px solid #ddd;
background-color: #f8f8f8;
color: #666;
font: normal 1.3em Helvetica, Arial, Verdana, Sans-serif;
}
h3 {
margin: 2% 0%;
padding: 1%;
border-bottom: 1px solid #ddd;
background-color: #f8f8f8;
color: #666;
font: normal 1.2em Helvetica, Arial, Verdana, Sans-serif;
}
table {
margin: 0;
padding: 0;
width: 100%;
}
table th {
border: 1px solid #ddd;
font-weight: bold;
text-align: left;
padding: 1%;
}
table td {
border: 1px solid #ddd;
padding: 1%;
}
dl, dt, dd {
margin: 0;
padding: 0;
}
form {
margin: 0;
padding: 0;
}
fieldset {
border: 1px solid #ddd;
margin: 0% 0% 2% 0%;
padding: 2%;
}
fieldset legend {
margin: 0;
padding: 0 4px;
background-color: inherit;
color: #333;
}
code {
font: 1em "Courier New", Courier, Monospace;
}
pre code {
font: 1.1em "Courier New", Courier, Monospace;
border-bottom: 1px solid #eee;
}
img {
border: 1px solid #eee;
}
p#statusgreen {
font-size: 1.2em;
background-color: #fff;
color: #0a0;
}
p#statusred {
font-size: 1.2em;
background-color: #fff;
color: #a00;
}
fieldset label {
display: block;
}
fieldset label.error {
color: red;
}
fieldset label.valid {
color: green;
}
fieldset div#captchaimage {
float: left;
margin-right: 15px;
}
fieldset input#captcha {
width: 25%;
border: 1px solid #ddd;
padding: 2px;
}
fieldset input#submit {
display: block;
margin: 2% 0% 0% 0%;
}

View File

@@ -0,0 +1,46 @@
/**********************************
Name: cmxform Styles
***********************************/
form.cmxform {
width: 370px;
font-size: 1.0em;
color: #333;
}
form.cmxform legend {
padding-left: 0;
}
form.cmxform legend, form.cmxform label {
color: #333;
}
form.cmxform fieldset {
border: none;
border-top: 1px solid #C9DCA6;
background: url(../images/cmxform-fieldset.gif) left bottom repeat-x;
background-color: #F8FDEF;
}
form.cmxform fieldset fieldset {
background: none;
}
form.cmxform fieldset p, form.cmxform fieldset fieldset {
padding: 5px 10px 7px;
background: url(../images/cmxform-divider.gif) left bottom repeat-x;
}
form.cmxform label.error, label.error {
/* remove the next line when you have trouble in IE6 with labels in list */
color: red;
font-style: italic
}
div.error { display: none; }
input { border: 1px solid black; }
input.checkbox { border: none }
input:focus { border: 1px dotted black; }
input.error { border: 1px dotted red; }
form.cmxform .gray * { color: gray; }

View File

@@ -0,0 +1,55 @@
/**********************************
Use: cmxform template
***********************************/
form.cmxform fieldset {
margin-bottom: 10px;
}
form.cmxform legend {
padding: 0 2px;
font-weight: bold;
_margin: 0 -7px; /* IE Win */
}
form.cmxform label {
display: inline-block;
line-height: 1.8;
vertical-align: top;
cursor: hand;
}
form.cmxform fieldset p {
list-style: none;
padding: 5px;
margin: 0;
}
form.cmxform fieldset fieldset {
border: none;
margin: 3px 0 0;
}
form.cmxform fieldset fieldset legend {
padding: 0 0 5px;
font-weight: normal;
}
form.cmxform fieldset fieldset label {
display: block;
width: auto;
}
form.cmxform label { width: 100px; } /* Width of labels */
form.cmxform fieldset fieldset label { margin-left: 103px; } /* Width plus 3 (html space) */
form.cmxform label.error {
margin-left: 103px;
width: 220px;
}
form.cmxform input.submit {
margin-left: 103px;
}
/*\*//*/ form.cmxform legend { display: inline-block; } /* IE Mac legend fix */

View File

@@ -0,0 +1,21 @@
body, div { font-family: 'lucida grande', helvetica, verdana, arial, sans-serif }
body { margin: 0; padding: 0; font-size: small; color: #333 }
h1, h2 { font-family: 'trebuchet ms', verdana, arial; padding: 10px; margin: 0 }
h1 { font-size: large }
#main { padding: 1em; }
#banner { padding: 15px; background-color: #06b; color: white; font-size: large; border-bottom: 1px solid #ccc;
background: url(../images/bg.gif) repeat-x; text-align: center }
#banner a { color: white; }
p { margin: 10px 0; }
li { margin-left: 10px; }
h3 { margin: 1em 0 0; }
h1 { font-size: 2em; }
h2 { font-size: 1.8em; }
h3 { font-size: 1.6em; }
h4 { font-size: 1.4em; }
h5 { font-size: 1.2em; }

View File

@@ -0,0 +1,61 @@
/**********************************
Use: Reset Styles for all browsers
***********************************/
body, p, blockquote {
margin: 0;
padding: 0;
}
a img, iframe { border: none; }
/* Headers
------------------------------*/
h1, h2, h3, h4, h5, h6 {
margin: 0;
padding: 0;
font-size: 100%;
}
/* Lists
------------------------------*/
ul, ol, dl, li, dt, dd {
margin: 0;
padding: 0;
}
/* Links
------------------------------*/
a, a:link {}
a:visited {}
a:hover {}
a:active {}
/* Forms
------------------------------*/
form, fieldset {
margin: 0;
padding: 0;
}
fieldset { border: 1px solid #000; }
legend {
padding: 0;
color: #000;
}
input, textarea, select {
margin: 0;
padding: 1px;
font-size: 100%;
font-family: inherit;
}
select { padding: 0; }

View File

@@ -0,0 +1,11 @@
/**********************************
Use: Main Screen Import
***********************************/
@import "reset.css";
@import "core.css";
@import "cmxformTemplate.css";
@import "cmxform.css";

View File

@@ -0,0 +1,74 @@
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>jQuery validation plug-in - comment form example</title>
<link rel="stylesheet" type="text/css" media="screen" href="css/screen.css" />
<script src="../lib/jquery.js" type="text/javascript"></script>
<script src="../dist/jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#commentForm").validate();
$("#commentForm2").validate({
messages: {
email: {
required: 'Enter this!'
}
}
});
});
</script>
<style type="text/css">
form { width: 500px; }
form label { width: 250px; }
form label.error,
form input.submit { margin-left: 253px; }
</style>
</head>
<body>
<h1 id="banner"><a href="http://bassistance.de/jquery-plugins/jquery-plugin-validation/">jQuery Validation Plugin</a> Demo</h1>
<div id="main">
<p>Take a look at the source to see how messages can be customized with metadata.</p>
<!-- Custom rules and messages via data- attributes -->
<form class="cmxform" id="commentForm" method="post" action="">
<fieldset>
<legend>Please enter your email address</legend>
<p>
<label for="cemail">E-Mail *</label>
<input id="cemail" name="email" data-rule-required="true" data-rule-email="true" data-msg-required="Please enter your email address" data-msg-email="Please enter a valid email address" />
</p>
<p>
<input class="submit" type="submit" value="Submit"/>
</p>
</fieldset>
</form>
<!-- Custom message for "required" in metadata is overridden by a validate option -->
<form class="cmxform" id="commentForm2" method="post" action="">
<fieldset>
<legend>Please enter your email address</legend>
<p>
<label for="cemail">E-Mail *</label>
<input id="cemail" name="email" data-rule-required="true" data-rule-email="true" data-msg-email="Please enter a valid email address" />
</p>
<p>
<input class="submit" type="submit" value="Submit"/>
</p>
</fieldset>
</form>
<a href="index.html">Back to main page</a>
</body>
</html>

View File

@@ -0,0 +1,116 @@
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Test for jQuery validate() plugin</title>
<link rel="stylesheet" type="text/css" media="screen" href="css/screen.css" />
<script src="../lib/jquery.js" type="text/javascript"></script>
<script src="../dist/jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript">
// extend the current rules with new groovy ones
// this one requires the text "buga", we define a default message, too
$.validator.addMethod("buga", function(value) {
return value == "buga";
}, 'Please enter "buga"!');
// this one requires the value to be the same as the first parameter
$.validator.methods.equal = function(value, element, param) {
return value == param;
};
$().ready(function() {
var validator = $("#texttests").bind("invalid-form.validate", function() {
$("#summary").html("Your form contains " + validator.numberOfInvalids() + " errors, see details below.");
}).validate({
debug: true,
errorElement: "em",
errorContainer: $("#warning, #summary"),
errorPlacement: function(error, element) {
error.appendTo( element.parent("td").next("td") );
},
success: function(label) {
label.text("ok!").addClass("success");
},
rules: {
number: {
required:true,
minlength:3,
maxlength:15,
number:true
},
secret: "buga",
math: {
equal: 11
}
}
});
});
</script>
<style type="text/css">
form.cmxform { width: 50em; }
em.error {
background:url("images/unchecked.gif") no-repeat 0px 0px;
padding-left: 16px;
}
em.success {
background:url("images/checked.gif") no-repeat 0px 0px;
padding-left: 16px;
}
form.cmxform label.error {
margin-left: auto;
width: 250px;
}
em.error { color: black; }
#warning { display: none; }
</style>
</head>
<body>
<h1 id="banner"><a href="http://bassistance.de/jquery-plugins/jquery-plugin-validation/">jQuery Validation Plugin</a> Demo</h1>
<div id="main">
<form class="cmxform" id="texttests" method="get" action="foo.html">
<h2 id="summary"></h2>
<fieldset>
<legend>Example with custom methods and heavily customized error display</legend>
<table>
<tr>
<td><label for="number">textarea</label></td>
<td><input id="number" name="number"
title="Please enter a number with at least 3 and max 15 characters!" />
</td>
<td></td>
</tr>
<tr>
<td><label for="secret">Secret</label></td>
<td><input name="secret" id="secret" /></td>
<td></td>
</tr>
<tr>
<td><label for="math">7 + 4 = </label></td>
<td><input id="math" name="math" title="Please enter the correct result!" /></td>
<td></td>
</tr>
</table>
<input class="submit" type="submit" value="Submit"/>
</fieldset>
</form>
<h3 id="warning">Your form contains tons of errors! Please try again.</h3>
<p><a href="index.html">Back to main page</a></p>
</div>
</body>
</html>

View File

@@ -0,0 +1,145 @@
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>jQuery validation plug-in - dynamic forms demo</title>
<link rel="stylesheet" type="text/css" media="screen" href="css/screen.css" />
<script src="../lib/jquery.js" type="text/javascript"></script>
<script src="../dist/jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript">
// only for demo purposes
$.validator.setDefaults({
submitHandler: function() {
alert("submitted!");
}
});
$.validator.messages.max = jQuery.validator.format("Your totals mustn't exceed {0}!");
$.validator.addMethod("quantity", function(value, element) {
return !this.optional(element) && !this.optional($(element).parent().prev().children("select")[0]);
}, "Please select both the item and its amount.");
$().ready(function() {
$("#orderform").validate({
errorPlacement: function(error, element) {
error.appendTo( element.parent().next() );
},
highlight: function(element, errorClass) {
$(element).addClass(errorClass).parent().prev().children("select").addClass(errorClass);
}
});
var template = jQuery.validator.format($.trim($("#template").val()));
function addRow() {
$(template(i++)).appendTo("#orderitems tbody");
}
var i = 1;
// start with one row
addRow();
// add more rows on click
$("#add").click(addRow);
// check keyup on quantity inputs to update totals field
$("#orderform").validateDelegate("input.quantity", "keyup", function(event) {
var totals = 0;
$("#orderitems input.quantity").each(function() {
totals += +this.value;
});
$("#totals").attr("value", totals).valid();
});
});
</script>
<style type="text/css">
form.cmxform { width: 50em; }
em.error {
background:url("images/unchecked.gif") no-repeat 0px 0px;
padding-left: 16px;
}
em.success {
background:url("images/checked.gif") no-repeat 0px 0px;
padding-left: 16px;
}
form.cmxform label.error {
margin-left: auto;
width: 250px;
}
form.cmxform input.submit {
margin-left: 0;
}
em.error { color: black; }
#warning { display: none; }
select.error {
border: 1px dotted red;
}
</style>
</head>
<body>
<h1 id="banner"><a href="http://bassistance.de/jquery-plugins/jquery-plugin-validation/">jQuery Validation Plugin</a> Demo</h1>
<div id="main">
<textarea style="display:none" id="template">
<tr>
<td>
<label>{0}. Item</label>
</td>
<td class='type'>
<select name="item-type-{0}">
<option value="">Select...</option>
<option value="0">Learning jQuery</option>
<option value="1">jQuery Reference Guide</option>
<option value="2">jQuery Cookbook</option>
<option vlaue="3">jQuery In Action</option>
<option value="4">jQuery For Designers</option>
</select>
</td>
<td class='quantity'>
<input size='4' class="quantity" min="1" id="item-quantity-{0}" name="item-quantity-{0}" />
</td>
<td class='quantity-error'></td>
</tr>
</textarea>
<form id="orderform" class="cmxform" method="get" action="foo.html">
<h2 id="summary"></h2>
<fieldset>
<legend>Example with custom methods and heavily customized error display</legend>
<table id="orderitems">
<tbody>
</tbody>
<tfoot>
<tr>
<td colspan="2"><label>Totals (max 25)</label></td>
<td class="totals"><input id="totals" name="totals" value="0" max="25" readonly="readonly" size='4' /></td>
<td class="totals-error"></td>
</tr>
<tr>
<td colspan="2">&nbsp;</td>
<td><input class="submit" type="submit" value="Submit"/></td>
</tr>
</tfoot>
</table>
</fieldset>
</form>
<button id="add">Add another input to the form</button>
<h1 id="warning">Your form contains tons of errors! Please try again.</h1>
<p><a href="index.html">Back to main page</a></p>
</div>
</body>
</html>

View File

@@ -0,0 +1,149 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Test for jQuery validate() plugin</title>
<link rel="stylesheet" media="screen" href="css/screen.css" />
<script src="../lib/jquery.js"></script>
<script src="../dist/jquery.validate.js"></script>
<style>
.cmxform fieldset p.error label { color: red; }
div.container {
background-color: #eee;
border: 1px solid red;
margin: 5px;
padding: 5px;
}
div.container ol li {
list-style-type: disc;
margin-left: 20px;
}
div.container { display: none }
.container label.error {
display: inline;
}
form.cmxform { width: 30em; }
form.cmxform label.error {
display: block;
margin-left: 1em;
width: auto;
}
</style>
<script>
// only for demo purposes
$.validator.setDefaults({
submitHandler: function() {
alert("submitted! (skipping validation for cancel button)");
}
});
$().ready(function() {
$("#form1").validate({
errorLabelContainer: $("#form1 div.error")
});
var container = $('div.container');
// validate the form when it is submitted
var validator = $("#form2").validate({
errorContainer: container,
errorLabelContainer: $("ol", container),
wrapper: 'li'
});
$(".cancel").click(function() {
validator.resetForm();
});
});
</script>
</head>
<body>
<h1 id="banner"><a href="http://bassistance.de/jquery-plugins/jquery-plugin-validation/">jQuery Validation Plugin</a> Demo</h1>
<div id="main">
<form method="get" class="cmxform" id="form1" action="">
<fieldset>
<legend>Login Form</legend>
<p>
<label>Username</label>
<input name="user" title="Please enter your username (at least 3 characters)" required minlength="3">
</p>
<p>
<label>Password</label>
<input type="password" maxlength="12" name="password" title="Please enter your password, between 5 and 12 characters" required minlength="5">
</p>
<div class="error">
</div>
<p>
<input class="submit" type="submit" value="Login"/>
</p>
</fieldset>
</form>
<!-- our error container -->
<div class="container">
<h4>There are serious errors in your form submission, please see below for details.</h4>
<ol>
<li><label for="email" class="error">Please enter your email address</label></li>
<li><label for="phone" class="error">Please enter your phone <b>number</b> (between 2 and 8 characters)</label></li>
<li><label for="address" class="error">Please enter your address (at least 3 characters)</label></li>
<li><label for="avatar" class="error">Please select an image (png, jpg, jpeg, gif)</label></li>
<li><label for="cv" class="error">Please select a document (doc, docx, txt, pdf)</label></li>
</ol>
</div>
<form class="cmxform" id="form2" method="get" action="">
<fieldset>
<legend>Validating a complete form</legend>
<p>
<label for="email">Email</label>
<input id="email" name="email" required type="email">
</p>
<p>
<label for="agree">Favorite Color</label>
<select id="color" name="color" title="Please select your favorite color!" required>
<option>&nbsp;</option>
<option>Red</option>
<option>Blue</option>
<option>Yellow</option>
</select>
</p>
<p>
<label for="phone">Phone</label>
<input id="phone" name="phone" required type="number" rangelength="[2,8]">
</p>
<p>
<label for="address">Address</label>
<input id="address" name="address" required minlength="3">
</p>
<p>
<label for="avatar">Avatar</label>
<input type="file" id="avatar" name="avatar" required>
</p>
<p>
<label for="agree">Please agree to our policy</label>
<input type="checkbox" class="checkbox" id="agree" title="Please agree to our policy!" name="agree" required>
</p>
<p>
<input class="submit" type="submit" value="Submit"/>
<input class="cancel" type="submit" value="Cancel"/>
</p>
</fieldset>
</form>
<div class="container">
<h4>There are serious errors in your form submission, please see details above the form!</h4>
</div>
<a href="index.html">Back to main page</a>
</div>
</body>
</html>

View File

@@ -0,0 +1,53 @@
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>jQuery validation plug-in - comment form example</title>
<link rel="stylesheet" href="css/screen.css" />
<link rel="stylesheet" href="css/cmxform.css" />
<script src="../lib/jquery.js"></script>
<script src="../dist/jquery.validate.js"></script>
<script src="../dist/additional-methods.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#fileForm").validate();
});
</script>
</head>
<body>
<form class="cmxform" id="fileForm" method="post" action="">
<fieldset>
<legend>Select the indicated type of files?</legend>
<p>
<label for="file1">Select a plain text file (e.g. *.txt)</label>
<input type="file" id="file1" name="file1" class="required" accept="text/plain" />
</p>
<p>
<label for="file2">Select any image file</label>
<input type="file" id="file2" name="file2" class="required" accept="image/*"/>
</p>
<p>
<label for="file3">Select either a PDF or a EPS file</label>
<input type="file" id="file3" name="file3" class="required" accept="image/x-eps,application/pdf"/>
</p>
<p>
<label for="file4">Select any audio or image file</label>
<input type="file" id="file4" name="file4" class="required" accept="image/*,audio/*"/>
</p>
<p>
<label for="file5">Select one or more plain text files (e.g. *.txt)</label>
<input type="file" id="file5" name="file5" class="required" multiple accept="text/plain" />
</p>
<p>
<input class="submit" type="submit" value="Submit"/>
</p>
</fieldset>
</form>
</body>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 220 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 43 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 314 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 418 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 223 B

View File

@@ -0,0 +1,229 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery validation plug-in - main demo</title>
<link rel="stylesheet" href="css/screen.css" />
<script src="../lib/jquery.js"></script>
<script src="../dist/jquery.validate.js"></script>
<script>
$.validator.setDefaults({
submitHandler: function() { alert("submitted!"); }
});
$().ready(function() {
// validate the comment form when it is submitted
$("#commentForm").validate();
// validate signup form on keyup and submit
$("#signupForm").validate({
rules: {
firstname: "required",
lastname: "required",
username: {
required: true,
minlength: 2
},
password: {
required: true,
minlength: 5
},
confirm_password: {
required: true,
minlength: 5,
equalTo: "#password"
},
email: {
required: true,
email: true
},
topic: {
required: "#newsletter:checked",
minlength: 2
},
agree: "required"
},
messages: {
firstname: "Please enter your firstname",
lastname: "Please enter your lastname",
username: {
required: "Please enter a username",
minlength: "Your username must consist of at least 2 characters"
},
password: {
required: "Please provide a password",
minlength: "Your password must be at least 5 characters long"
},
confirm_password: {
required: "Please provide a password",
minlength: "Your password must be at least 5 characters long",
equalTo: "Please enter the same password as above"
},
email: "Please enter a valid email address",
agree: "Please accept our policy"
}
});
// propose username by combining first- and lastname
$("#username").focus(function() {
var firstname = $("#firstname").val();
var lastname = $("#lastname").val();
if(firstname && lastname && !this.value) {
this.value = firstname + "." + lastname;
}
});
//code to hide topic selection, disable for demo
var newsletter = $("#newsletter");
// newsletter topics are optional, hide at first
var inital = newsletter.is(":checked");
var topics = $("#newsletter_topics")[inital ? "removeClass" : "addClass"]("gray");
var topicInputs = topics.find("input").attr("disabled", !inital);
// show when newsletter is checked
newsletter.click(function() {
topics[this.checked ? "removeClass" : "addClass"]("gray");
topicInputs.attr("disabled", !this.checked);
});
});
</script>
<style type="text/css">
#commentForm { width: 500px; }
#commentForm label { width: 250px; }
#commentForm label.error, #commentForm input.submit { margin-left: 253px; }
#signupForm { width: 670px; }
#signupForm label.error {
margin-left: 10px;
width: auto;
display: inline;
}
#newsletter_topics label.error {
display: none;
margin-left: 103px;
}
</style>
</head>
<body>
<h1 id="banner"><a href="http://bassistance.de/jquery-plugins/jquery-plugin-validation/">jQuery Validation Plugin</a> Demo</h1>
<div id="main">
<p>Default submitHandler is set to display an alert into of submitting the form</p>
<form class="cmxform" id="commentForm" method="get" action="">
<fieldset>
<legend>Please provide your name, email address (won't be published) and a comment</legend>
<p>
<label for="cname">Name (required, at least 2 characters)</label>
<input id="cname" name="name" minlength="2" type="text" required>
</p>
<p>
<label for="cemail">E-Mail (required)</label>
<input id="cemail" type="email" name="email" required>
</p>
<p>
<label for="curl">URL (optional)</label>
<input id="curl" type="url" name="url">
</p>
<p>
<label for="ccomment">Your comment (required)</label>
<textarea id="ccomment" name="comment" required></textarea>
</p>
<p>
<input class="submit" type="submit" value="Submit">
</p>
</fieldset>
</form>
<form class="cmxform" id="signupForm" method="get" action="">
<fieldset>
<legend>Validating a complete form</legend>
<p>
<label for="firstname">Firstname</label>
<input id="firstname" name="firstname" type="text" />
</p>
<p>
<label for="lastname">Lastname</label>
<input id="lastname" name="lastname" type="text" />
</p>
<p>
<label for="username">Username</label>
<input id="username" name="username" type="text" />
</p>
<p>
<label for="password">Password</label>
<input id="password" name="password" type="password" />
</p>
<p>
<label for="confirm_password">Confirm password</label>
<input id="confirm_password" name="confirm_password" type="password" />
</p>
<p>
<label for="email">Email</label>
<input id="email" name="email" type="email" />
</p>
<p>
<label for="agree">Please agree to our policy</label>
<input type="checkbox" class="checkbox" id="agree" name="agree" />
</p>
<p>
<label for="newsletter">I'd like to receive the newsletter</label>
<input type="checkbox" class="checkbox" id="newsletter" name="newsletter" />
</p>
<fieldset id="newsletter_topics">
<legend>Topics (select at least two) - note: would be hidden when newsletter isn't selected, but is visible here for the demo</legend>
<label for="topic_marketflash">
<input type="checkbox" id="topic_marketflash" value="marketflash" name="topic" />
Marketflash
</label>
<label for="topic_fuzz">
<input type="checkbox" id="topic_fuzz" value="fuzz" name="topic" />
Latest fuzz
</label>
<label for="topic_digester">
<input type="checkbox" id="topic_digester" value="digester" name="topic" />
Mailing list digester
</label>
<label for="topic" class="error">Please select at least two topics you'd like to receive.</label>
</fieldset>
<p>
<input class="submit" type="submit" value="Submit"/>
</p>
</fieldset>
</form>
<h3>Synthetic examples</h3>
<ul>
<li><a href="errorcontainer-demo.html">Error message containers in action</a></li>
<li><a href="custom-messages-data-demo.html">Custom Messages as Element Data</a></li>
<li><a href="radio-checkbox-select-demo.html">Radio and checkbox buttons and selects</a></li>
<li><a href="ajaxSubmit-integration-demo.html">Integration with Form Plugin (AJAX submit)</a></li>
<li><a href="custom-methods-demo.html">Custom methods and message display.</a></li>
<li><a href="dynamic-totals.html">Dynamic forms</a></li>
<li><a href="themerollered.html">Forms styled with jQuery UI Themeroller</a></li>
<li><a href="tinymce/">TinyMCE Demo</a></li>
<li><a href="file_input.html">File inputs</a></li>
<li><a href="jquerymobile.html">jQuery Mobile Form Validation</a></li>
</ul>
<h3>Real-world examples</h3>
<ul>
<li><a href="milk/">Remember The Milk signup form</a></li>
<li><a href="marketo/">Marketo signup form</a></li>
<li><a href="multipart/">Buy and Sell a House multipart form</a></li>
<li><a href="captcha/">Remote captcha validation</a></li>
</ul>
<h3>Testsuite</h3>
<ul>
<li><a href="../test/">Validation Testsuite</a></li>
</ul>
</div>
</body>
</html>

View File

@@ -0,0 +1,71 @@
<!DOCTYPE html>
<html>
<head>
<title>My Page</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>
<script src="../dist/jquery.validate.js"></script>
<style>
label.error {
color: red;
font-size: 16px;
font-weight: normal;
line-height: 1.4;
margin-top: 0.5em;
width: 100%;
float: none;
}
@media screen and (orientation: portrait){
label.error { margin-left: 0; display: block; }
}
@media screen and (orientation: landscape){
label.error { display: inline-block; margin-left: 22%; }
}
em { color: red; font-weight: bold; padding-right: .25em; }
</style>
</head>
<body>
<div id="page1" data-role="page">
<div data-role="header">
<h1>Welcome</h1>
</div>
<div data-role="content">
<form method="GET">
<div data-role="fieldcontain">
<label for="email">Email:</label>
<input type="email" name="email" id="email" />
</div>
<div data-role="fieldcontain">
<label for="password">Password:</label>
<input type="password" name="password" id="password" />
</div>
<input data-role="submit" type="submit" value="Login" />
</form>
</div>
</div>
<script>
$('#page1').bind('pageinit', function(event) {
$('form').validate({
rules: {
email: {
required: true
},
password: {
required: true
}
}
});
});
</script>
</body>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 89 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 442 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 664 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 121 B

View File

@@ -0,0 +1,76 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Login Form with Email Password Link</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" media="screen" href="screen.css" />
<script type="text/javascript" src="../../lib/jquery.js"></script>
<script type="text/javascript" src="../../dist/jquery.validate.js"></script>
<script type="text/javascript">
$(function() {
// highlight
var elements = $("input[type!='submit'], textarea, select");
elements.focus(function(){
$(this).parents('li').addClass('highlight');
});
elements.blur(function(){
$(this).parents('li').removeClass('highlight');
});
$("#forgotpassword").click(function() {
$("#password").removeClass("required");
$("#login").submit();
$("#password").addClass("required");
return false;
});
$("#login").validate()
});
</script>
</head>
<body>
<div id="page">
<div id="header">
<h1>Login</h1>
</div>
<div id="content">
<p id="status"></p>
<form action="" method="get" id="login">
<fieldset>
<legend>User details</legend>
<ul>
<li>
<label for="email"><span class="required">Email address</span></label>
<input id="email" name="email" class="text required email" type="text" />
<label for="email" class="error">This must be a valid email address</label>
</li>
<li>
<label for="password"><span class="required">Password</span></label>
<input name="password" type="password" class="text required" id="password" minlength="4" maxlength="20" />
</li>
<li>
<label class="centered info"><a id="forgotpassword" href="#">Email my password...</a></label>
</li>
</ul>
</fieldset>
<fieldset class="submit">
<input type="submit" class="button" value="Login..." />
</fieldset>
<div class="clear"></div>
</form>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,457 @@
/*******************************************************************************
********************************************************************************
**
* - GENERAL
*
* - PAGE CONTAINERS
*
* - HEADER
*
* - CONTENT
**
********************************************************************************
******************************************************************************/
/* GENERAL ------------------------------------------------------------------ */
html
{
height: 100%;
}
/* Zero default margin & padding around common elements */
body, dd, dl, dt, form, h1, h2, h3, h4, h5, h6, ul, ol, li, p
{
margin: 0;
border: none;
padding: 0;
}
body
{
height: 100%;
background-color: #333333;
background-image: url(images/bg.gif);
background-position: 0% 0;
color: #000000;
line-height: 1.5;
font-family: Arial, Helvetica, sans-serif;
font-size: 62.5%;
text-align: center;
overflow:auto;
}
a:link
{
color: #003399;
}
a:visited
{
color: #B266B2;
}
a:hover
{
text-decoration: none;
}
/* PAGE CONTAINERS ---------------------------------------------------------- */
#page
{
width: 636px;
w\idth: 600px;
min-height: 100%;
margin: 17px auto;
padding: 0 18px;
background-image: url(images/page.gif);
background-repeat: repeat-y;
text-align: left;
}
* html #page
{
height: 100%;
}
/* HEADER ------------------------------------------------------------------- */
#header
{
height: 90px;
background-color: #B2DD32;
background-image: url(images/header1.jpg);
background-repeat: repeat-x;
}
h1
{
padding: 0 35px;
font-size: 2.2em;
font-weight: normal;
line-height: 82px;
}
/* CONTENT ------------------------------------------------------------------ */
#content
{
padding: 0 25px;
}
p
{
font-size:1.1em;
margin-top: 1.5em;
}
form
{
margin-top: 1.5em;
}
/*** MASTER FORM WIDTHS - CUSTOMIZE THIS TO CHANGE THE FORM LAYOUT ***/
/*
form width: 550px
left column: 190px / 180px + 10px padding
mid column: 200px
right column: 160px
*/
form{
width:550px !important;
}
fieldset.submit
{
padding-left: 190px !important;
}
form label{
padding:0px 10px;
width: 160px;
}
form label.error,
form input.submit
{
margin-left:180px !important;
}
form fieldset fieldset label.error
{
margin-left:0px !important;
width:200px !important;
}
form .centered{
margin-left:180px !important;
width:200px !important;
}
form .text,
form .button,
form .group,
form .control,
form .submit,
form textarea,
form select
{
width: 200px !important;
}
/*** FIELDSETS AND LEGENDS ***/
form{
width:550px;
margin-bottom:25px;
clear:both;
}
form fieldset
{
margin: 0 0 1.5em 0;
padding: 0 0 10px 0px;
border: 1px solid #BFBAB0;
background-color: #F2EFE9;
background-image: url(images/fieldset_gradient.jpg);
background-repeat: repeat-x;
background-color: #fff;
background-image: url(images/fieldset-gradient-02.jpg);
background-position:bottom;
float: left;
clear: both;
width: 100%;
}
form fieldset.submit
{
padding: 0px 10px 10px 190px;
border-style: none;
background-color: transparent;
background-image: none;
float: none;
width: auto;
}
form legend
{
color: #000000;
font-size:1.3em;
font-weight: bold;
font-variant:small-caps;
margin-left: 1em;
padding:0px 5px;
}
form fieldset p{
margin:10px 0px 0px 10px;
}
/*** FORM BLOCKS ***/
form ul
{
padding:5px 10px;
list-style: none;
}
form li
{
width: 100%;
padding:5px 0px 10px 0;
border-top:1px dotted #ccc;
display:block;
float: left;
clear: left;
}
form li:first-child
{
border:none;
}
/*** FORM BLOCK ELEMENTS ***/
form label
{
padding:0px 10px;
width: 160px;
float: left;
}
form .error{
color: #c00;
}
form label.error
{
color: #c00;
font-size: 100%;
font-weight: bold;
font-variant:small-caps;
width:308px;
display: none;
margin:8px 0px 0px 180px;
padding:3px 0px 0px 5px;
border-top:1px dotted #ccc;
clear:both;
}
form label.info{
font-size: 100%;
font-weight: bold;
font-variant:small-caps;
margin:8px 0px 0px 180px;
padding:3px 0px 0px 5px;
}
form fieldset fieldset,
form .group
{
width:200px;
margin: 0;
border:none;
background:none;
float:left;
clear: none;
}
form fieldset fieldset label
{
width:auto !important;
white-space:nowrap;
padding:0px;
margin:0px;
display:block;
clear:both;
}
form label label.error{
margin-left:0px;
}
form label.centered{
padding:0px 0px;
width:200px !important;
}
/* see also the error class at the foot of the page */
form fieldset fieldset label.spaced
{
margin-bottom:3px;
}
/*** FORM ELEMENT COLUMNS ***/
.col-1,
fieldset fieldset.col-1 label
{
width:100%;
}
.col-2,
fieldset fieldset.col-2 label
{
width:50%;
}
.col-3,
fieldset fieldset.col-3 label
{
width:33%;
}
.col-4,
fieldset fieldset.col-4 label
{
width:25%;
}
/*** FORM ELEMENTS ***/
form input.submit{
margin:10px 0px 10px 180px;
padding:0px 2px;
}
form input, textarea, select,
form label
{
font-size:1.1em;
line-height:1.6em;
}
form input, textarea, select
{
font-family: Verdana, Arial, Helvetica, sans-serif;
}
form .input[type="text"],
form textarea
{
padding:1px;
}
form .input[type="radio"],
form .input[type="checkbox"]
{
margin:0px;
padding:0px;
position:relative;
top:3px;
}
/*** SUPPORTING CLASSES ***/
form label.required{
background-image:url(images/required_star.gif);
background-position:right;
background-repeat:no-repeat;
}
form span.required{
padding-right:15px;
}
form .clean
{
border:none;
}
form .info{
padding-top:0.5em;
font-size:80%;
line-height:100%;
color:#aaa;
}
form .indent{
padding:2px 20px;
width:auto !important;
white-space:nowrap;
padding-left: 25px !important;
}
form label.disabled{
color:#aaa;
}
form .highlight{
background-color:#e2e2e2;
}
.off{
display:none !important;
}
.clear{
clear:both;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 137 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 799 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 793 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 845 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 234 B

View File

@@ -0,0 +1,228 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Subscription Signup | Marketo</title>
<script src="../../lib/jquery.js"></script>
<script src="../../lib/jquery.mockjax.js"></script>
<script src="../../dist/jquery.validate.js"></script>
<script src="jquery.maskedinput.js"></script>
<script src="mktSignup.js"></script>
<link rel="stylesheet" href="stylesheet.css" />
</head>
<body>
<!-- start page wrapper --><div id="letterbox">
<!-- start header container -->
<div id="header-background">
<div class="nav-global-container">
<div class="login"><a href="#"><span></span>Customer Login</a></div>
<div class="logo"><a href="#"><img src="images/logo_marketo.gif" width="168" height="73" alt="Marketo" /></a></div>
<div class="nav-global">
<ul>
<li><a href="#" class="nav-g01"><span></span>Home</a></li>
<li><a href="#" class="nav-g02"><span></span>Products</a></li>
<li><a href="#" class="nav-g04"><span></span>B2B Marketing Resources</a></li>
<li><a href="#" class="nav-g05"><span></span>About Marketo</a></li>
</ul>
</div>
</div>
</div>
<!-- end header container -->
<div class="line-grey-tier"></div>
<!-- start page container 2 div-->
<div id="page-container" class="resize"><div id="page-content-inner" class="resize">
<!-- start col-main -->
<div id="col-main" class="resize" style="">
<!-- start main content -->
<div class="main-content resize">
<div class="action-container" style="display:none;"></div>
<h1>Step 1 of 2 </h1>
<p>
</p>
<br clear="all" />
<div>
<form id="profileForm" type="actionForm" action="step2.htm" method="get" >
<div class="error" style="display:none;">
<img src="images/warning.gif" alt="Warning!" width="24" height="24" style="float:left; margin: -5px 10px 0px 0px; " />
<span></span>.<br clear="all"/>
</div>
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td class="label"><label for="co_name">Company Name:</label></td>
<td class="field">
<input id="co_name" class="required" maxlength="40" name="co_name" size="20" type="text" tabindex="1" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="co_url">Company URL:</label></td>
<td class="field">
<input id="co_url" class="required defaultInvalid url" maxlength="40" name="co_url" style="width:163px" type="text" tabindex="2" value="http://" />
</td>
</tr>
<tr>
<td/><td/>
</tr>
<tr>
<td class="label"><label for="first_name">First Name:</label></td>
<td class="field">
<input id="first_name" class="required" maxlength="40" name="first_name" size="20" type="text" tabindex="3" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="last_name">Last Name:</label></td>
<td class="field">
<input id="last_name" class="required" maxlength="40" name="last_name" size="20" type="text" tabindex="4" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="address1">Company Address:</label></td>
<td class="field">
<input maxlength="40" class="required" name="address1" size="20" type="text" tabindex="5" value="" />
</td>
</tr>
<tr>
<td class="label"></td>
<td class="field">
<input maxlength="40" name="address2" size="20" type="text" tabindex="6" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="city">City:</label></td>
<td class="field">
<input maxlength="40" class="required" name="city" size="20" type="text" tabindex="7" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="state">State:</label></td>
<td class="field">
<select id="state" class="required" name="state" style="margin-left: 4px;" tabindex="8">
<option value="">Choose State:</option>
<option value="AL">Alabama</option><option value="AK">Alaska</option><option value="AZ">Arizona</option><option value="AR">Arkansas</option><option value="CA">California</option><option value="CO">Colorado</option><option value="CT">Connecticut</option><option value="DE">Delaware</option><option value="FL">Florida</option><option value="GA">Georgia</option><option value="HI">Hawaii</option><option value="ID">Idaho</option><option value="IL">Illinois</option><option value="IN">Indiana</option><option value="IA">Iowa</option><option value="KS">Kansas</option><option value="KY">Kentucky</option><option value="LA">Louisiana</option><option value="ME">Maine</option><option value="MD">Maryland</option><option value="MA">Massachusetts</option><option value="MI">Michigan</option><option value="MN">Minnesota</option><option value="MS">Mississippi</option><option value="MO">Missouri</option><option value="MT">Montana</option><option value="NE">Nebraska</option><option value="NV">Nevada</option><option value="NH">New Hampshire</option><option value="NJ">New Jersey</option><option value="NM">New Mexico</option><option value="NY">New York</option><option value="NC">North Carolina</option><option value="ND">North Dakota</option><option value="OH">Ohio</option><option value="OK">Oklahoma</option><option value="OR">Oregon</option><option value="PA">Pennsylvania</option><option value="RI">Rhode Island</option><option value="SC">South Carolina</option><option value="SD">South Dakota</option><option value="TN">Tennessee</option><option value="TX">Texas</option><option value="UT">Utah</option><option value="VT">Vermont</option><option value="VA">Virginia</option><option value="WA">Washington</option><option value="WV">West Virginia</option><option value="WI">Wisconsin</option><option value="WY">Wyoming</option>
</select>
</td>
</tr>
<tr>
<td class="label"><label for="zip">Zip:</label></td>
<td class="field">
<input maxlength="10" name="zip" style="width: 100px" type="text" class="required zipcode" tabindex="9" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="phone">Phone:</label></td>
<td class="field">
<input id="phone" maxlength="14" name="phone" type="text" class="required phone" tabindex="10" value="" />
</td>
</tr>
<tr>
<td colspan="2">
<h2 style="border-bottom: 1px solid #CCCCCC;">Login Information</h2>
</td>
</tr>
<tr>
<td class="label"><label for="email">Email:</label></td>
<td class="field">
<input id="email" class="required email" remote="emails.action" maxlength="40" name="email" size="20" type="text" tabindex="11" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="password1">Password:</label></td>
<td class="field">
<input id="password1" class="required password" maxlength="40" name="password1" size="20" type="password" tabindex="12" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="password2">Retype Password:</label></td>
<td class="field">
<input id="password2" class="required" equalTo="#password1" maxlength="40" name="password2" size="20" type="password" tabindex="13" value="" />
<div class="formError"></div>
</td>
</tr>
<tr>
<td></td>
<td>
<div class="buttonSubmit">
<span></span>
<input class="formButton" type="submit" value="Next" style="width: 140px" tabindex="14" />
</div>
</td>
</tr>
</table><br /><br />
</form>
<br clear="all"/>
</div>
</div> <!-- end main content -->
<br />
</div> <!-- end col-main -->
<!-- start left col -->
<div id="col-left" class="nav-left-back empty resize" style="position: absolute; min-height: 450px;">
<div class="col-left-header-tab" style="position: absolute;">Signup</div>
<div class="nav-left">
</div>
<div class="left-nav-callout png" style="top: 15px; margin-bottom: 100px;">
<img src="images/left-nav-callout-long.png" class="png" alt="" />
<h6>Sign Up Process</h6>
<a style="background-image: url(images/step1-24.gif); font-weight: normal; text-decoration: none; cursor: default;">Sign up with a valid credit card.</a>
<a style="background-image: url(images/step2-24.gif); font-weight: normal; text-decoration: none; cursor: default;">Connect to your Google AdWords account. You will need your AdWords Customer ID.</a>
<a style="background-image: url(images/step3-24.gif); font-weight: normal; text-decoration: none; cursor: default;">Start your 30 day trial. No payments until trial ends.</a>
</div>
<div class="footerAddress">
<b>Marketo Inc.</b><br />
1710 S. Amphlett Blvd.<br />
San Mateo, CA 94402 USA<br />
</div>
<br clear="all"/>
</div> <!-- end left col -->
</div> </div> <!-- end page container 2 divs-->
<div id="footer-container" align="center">
<div class="footer">
<ul>
<li><a href="..">Home</a></li>
<li class="line-off"><a href="step2.htm">Second step</a></li>
</ul>
</div></div>
<!-- end page wrapper -->
</div>
</body>
</html>

View File

@@ -0,0 +1,338 @@
/*
Masked Input plugin for jQuery
Copyright (c) 2007-2013 Josh Bush (digitalbush.com)
Licensed under the MIT license (http://digitalbush.com/projects/masked-input-plugin/#license)
Version: 1.3.1
*/
(function($) {
function getPasteEvent() {
var el = document.createElement('input'),
name = 'onpaste';
el.setAttribute(name, '');
return (typeof el[name] === 'function')?'paste':'input';
}
var pasteEventName = getPasteEvent() + ".mask",
ua = navigator.userAgent,
iPhone = /iphone/i.test(ua),
android=/android/i.test(ua),
caretTimeoutId;
$.mask = {
//Predefined character definitions
definitions: {
'9': "[0-9]",
'a': "[A-Za-z]",
'*': "[A-Za-z0-9]"
},
dataName: "rawMaskFn",
placeholder: '_',
};
$.fn.extend({
//Helper Function for Caret positioning
caret: function(begin, end) {
var range;
if (this.length === 0 || this.is(":hidden")) {
return;
}
if (typeof begin == 'number') {
end = (typeof end === 'number') ? end : begin;
return this.each(function() {
if (this.setSelectionRange) {
this.setSelectionRange(begin, end);
} else if (this.createTextRange) {
range = this.createTextRange();
range.collapse(true);
range.moveEnd('character', end);
range.moveStart('character', begin);
range.select();
}
});
} else {
if (this[0].setSelectionRange) {
begin = this[0].selectionStart;
end = this[0].selectionEnd;
} else if (document.selection && document.selection.createRange) {
range = document.selection.createRange();
begin = 0 - range.duplicate().moveStart('character', -100000);
end = begin + range.text.length;
}
return { begin: begin, end: end };
}
},
unmask: function() {
return this.trigger("unmask");
},
mask: function(mask, settings) {
var input,
defs,
tests,
partialPosition,
firstNonMaskPos,
len;
if (!mask && this.length > 0) {
input = $(this[0]);
return input.data($.mask.dataName)();
}
settings = $.extend({
placeholder: $.mask.placeholder, // Load default placeholder
completed: null
}, settings);
defs = $.mask.definitions;
tests = [];
partialPosition = len = mask.length;
firstNonMaskPos = null;
$.each(mask.split(""), function(i, c) {
if (c == '?') {
len--;
partialPosition = i;
} else if (defs[c]) {
tests.push(new RegExp(defs[c]));
if (firstNonMaskPos === null) {
firstNonMaskPos = tests.length - 1;
}
} else {
tests.push(null);
}
});
return this.trigger("unmask").each(function() {
var input = $(this),
buffer = $.map(
mask.split(""),
function(c, i) {
if (c != '?') {
return defs[c] ? settings.placeholder : c;
}
}),
focusText = input.val();
function seekNext(pos) {
while (++pos < len && !tests[pos]);
return pos;
}
function seekPrev(pos) {
while (--pos >= 0 && !tests[pos]);
return pos;
}
function shiftL(begin,end) {
var i,
j;
if (begin<0) {
return;
}
for (i = begin, j = seekNext(end); i < len; i++) {
if (tests[i]) {
if (j < len && tests[i].test(buffer[j])) {
buffer[i] = buffer[j];
buffer[j] = settings.placeholder;
} else {
break;
}
j = seekNext(j);
}
}
writeBuffer();
input.caret(Math.max(firstNonMaskPos, begin));
}
function shiftR(pos) {
var i,
c,
j,
t;
for (i = pos, c = settings.placeholder; i < len; i++) {
if (tests[i]) {
j = seekNext(i);
t = buffer[i];
buffer[i] = c;
if (j < len && tests[j].test(t)) {
c = t;
} else {
break;
}
}
}
}
function keydownEvent(e) {
var k = e.which,
pos,
begin,
end;
//backspace, delete, and escape get special treatment
if (k === 8 || k === 46 || (iPhone && k === 127)) {
pos = input.caret();
begin = pos.begin;
end = pos.end;
if (end - begin === 0) {
begin=k!==46?seekPrev(begin):(end=seekNext(begin-1));
end=k===46?seekNext(end):end;
}
clearBuffer(begin, end);
shiftL(begin, end - 1);
e.preventDefault();
} else if (k == 27) {//escape
input.val(focusText);
input.caret(0, checkVal());
e.preventDefault();
}
}
function keypressEvent(e) {
var k = e.which,
pos = input.caret(),
p,
c,
next;
if (e.ctrlKey || e.altKey || e.metaKey || k < 32) {//Ignore
return;
} else if (k) {
if (pos.end - pos.begin !== 0){
clearBuffer(pos.begin, pos.end);
shiftL(pos.begin, pos.end-1);
}
p = seekNext(pos.begin - 1);
if (p < len) {
c = String.fromCharCode(k);
if (tests[p].test(c)) {
shiftR(p);
buffer[p] = c;
writeBuffer();
next = seekNext(p);
if(android){
setTimeout($.proxy($.fn.caret,input,next),0);
}else{
input.caret(next);
}
if (settings.completed && next >= len) {
settings.completed.call(input);
}
}
}
e.preventDefault();
}
}
function clearBuffer(start, end) {
var i;
for (i = start; i < end && i < len; i++) {
if (tests[i]) {
buffer[i] = settings.placeholder;
}
}
}
function writeBuffer() { input.val(buffer.join('')); }
function checkVal(allow) {
//try to place characters where they belong
var test = input.val(),
lastMatch = -1,
i,
c;
for (i = 0, pos = 0; i < len; i++) {
if (tests[i]) {
buffer[i] = settings.placeholder;
while (pos++ < test.length) {
c = test.charAt(pos - 1);
if (tests[i].test(c)) {
buffer[i] = c;
lastMatch = i;
break;
}
}
if (pos > test.length) {
break;
}
} else if (buffer[i] === test.charAt(pos) && i !== partialPosition) {
pos++;
lastMatch = i;
}
}
if (allow) {
writeBuffer();
} else if (lastMatch + 1 < partialPosition) {
input.val("");
clearBuffer(0, len);
} else {
writeBuffer();
input.val(input.val().substring(0, lastMatch + 1));
}
return (partialPosition ? i : firstNonMaskPos);
}
input.data($.mask.dataName,function(){
return $.map(buffer, function(c, i) {
return tests[i]&&c!=settings.placeholder ? c : null;
}).join('');
});
if (!input.attr("readonly"))
input
.one("unmask", function() {
input
.unbind(".mask")
.removeData($.mask.dataName);
})
.bind("focus.mask", function() {
clearTimeout(caretTimeoutId);
var pos,
moveCaret;
focusText = input.val();
pos = checkVal();
caretTimeoutId = setTimeout(function(){
writeBuffer();
if (pos == mask.length) {
input.caret(0, pos);
} else {
input.caret(pos);
}
}, 10);
})
.bind("blur.mask", function() {
checkVal();
if (input.val() != focusText)
input.change();
})
.bind("keydown.mask", keydownEvent)
.bind("keypress.mask", keypressEvent)
.bind(pasteEventName, function() {
setTimeout(function() {
var pos=checkVal(true);
input.caret(pos);
if (settings.completed && pos == input.val().length)
settings.completed.call(input);
}, 0);
});
checkVal(); //Perform initial check for existing values
});
}
});
})(jQuery);

View File

@@ -0,0 +1,133 @@
$(document).ready(function(){
$.mockjax({
url: "emails.action",
response: function(settings) {
var email = settings.data.email,
emails = ["glen@marketo.com", "george@bush.gov", "me@god.com", "aboutface@cooper.com", "steam@valve.com", "bill@gates.com"];
this.responseText = "true";
if ( $.inArray( email, emails ) !== -1 ) {
this.responseText = "false";
}
},
responseTime: 500
});
jQuery.validator.addMethod("password", function( value, element ) {
var result = this.optional(element) || value.length >= 6 && /\d/.test(value) && /[a-z]/i.test(value);
if (!result) {
element.value = "";
var validator = this;
setTimeout(function() {
validator.blockFocusCleanup = true;
element.focus();
validator.blockFocusCleanup = false;
}, 1);
}
return result;
}, "Your password must be at least 6 characters long and contain at least one number and one character.");
// a custom method making the default value for companyurl ("http://") invalid, without displaying the "invalid url" message
jQuery.validator.addMethod("defaultInvalid", function(value, element) {
return value != element.defaultValue;
}, "");
jQuery.validator.addMethod("billingRequired", function(value, element) {
if ($("#bill_to_co").is(":checked"))
return $(element).parents(".subTable").length;
return !this.optional(element);
}, "");
jQuery.validator.messages.required = "";
$("form").validate({
invalidHandler: function(e, validator) {
var errors = validator.numberOfInvalids();
if (errors) {
var message = errors == 1
? 'You missed 1 field. It has been highlighted below'
: 'You missed ' + errors + ' fields. They have been highlighted below';
$("div.error span").html(message);
$("div.error").show();
} else {
$("div.error").hide();
}
},
onkeyup: false,
submitHandler: function() {
$("div.error").hide();
alert("submit! use link below to go to the other step");
},
messages: {
password2: {
required: " ",
equalTo: "Please enter the same password as above"
},
email: {
required: " ",
email: "Please enter a valid email address, example: you@yourdomain.com",
remote: jQuery.validator.format("{0} is already taken, please enter a different address.")
}
},
debug:true
});
$(".resize").vjustify();
$("div.buttonSubmit").hoverClass("buttonSubmitHover");
$("input.phone").mask("(999) 999-9999");
$("input.zipcode").mask("99999");
var creditcard = $("#creditcard").mask("9999 9999 9999 9999");
$("#cc_type").change(
function() {
switch ($(this).val()){
case 'amex':
creditcard.unmask().mask("9999 999999 99999");
break;
default:
creditcard.unmask().mask("9999 9999 9999 9999");
break;
}
}
);
// toggle optional billing address
var subTableDiv = $("div.subTableDiv");
var toggleCheck = $("input.toggleCheck");
toggleCheck.is(":checked")
? subTableDiv.hide()
: subTableDiv.show();
$("input.toggleCheck").click(function() {
if (this.checked == true) {
subTableDiv.slideUp("medium");
$("form").valid();
} else {
subTableDiv.slideDown("medium");
}
});
});
$.fn.vjustify = function() {
var maxHeight=0;
$(".resize").css("height","auto");
this.each(function(){
if (this.offsetHeight > maxHeight) {
maxHeight = this.offsetHeight;
}
});
this.each(function(){
$(this).height(maxHeight);
if (this.offsetHeight > maxHeight) {
$(this).height((maxHeight-(this.offsetHeight-maxHeight)));
}
});
};
$.fn.hoverClass = function(classname) {
return this.hover(function() {
$(this).addClass(classname);
}, function() {
$(this).removeClass(classname);
});
};

View File

@@ -0,0 +1,263 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Subscription Signup | Marketo</title>
<script src="../../lib/jquery.js"></script>
<script src="../../lib/jquery.mockjax.js"></script>
<script src="../../jquery.validate.js"></script>
<script src="jquery.maskedinput.js"></script>
<script src="mktSignup.js"></script>
<link rel="stylesheet" href="stylesheet.css" />
</head>
<body>
<!-- start page wrapper --><div id="letterbox">
<!-- start header container -->
<div id="header-background">
<div class="nav-global-container">
<div class="login"><a href="#"><span></span>Customer Login</a></div>
<div class="logo"><a href="#"><img src="images/logo_marketo.gif" width="168" height="73" alt="Marketo" /></a></div>
<div class="nav-global">
<ul>
<li><a href="#" class="nav-g01"><span></span>Home</a></li>
<li><a href="#" class="nav-g02"><span></span>Products</a></li>
<li><a href="#" class="nav-g04"><span></span>B2B Marketing Resources</a></li>
<li><a href="#" class="nav-g05"><span></span>About Marketo</a></li>
</ul>
</div>
</div>
</div>
<!-- end header container -->
<div class="line-grey-tier"></div>
<!-- start page container 2 div-->
<div id="page-container" class="resize"><div id="page-content-inner" class="resize">
<!-- start col-main -->
<div id="col-main" class="resize" style="">
<!-- start main content -->
<div class="main-content resize">
<div class="action-container" style="display:none;"></div>
<h1>Step 2 of 2</h1>
<h2>Billing Information</h2>
<p>
</p>
<br clear="all" />
<div>
<form id="billingForm" action="" method="get" >
<div class="error" style="display:none;">
<img src="images/warning.gif" alt="Warning!" width="24" height="24" style="float:left; margin: -5px 10px 0px 0px; " />
<span></span>.<br clear="all" />
</div>
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td class="label" style="vertical-align: top; padding-top: 8px;">Billing Address:</td>
<td class="field" style="font-weight: normal">
<div class="billingAddressControl">
<input type="checkbox" id="bill_to_co" name="bill_to_co" class="toggleCheck" checked="checked" style="width: auto;" tabindex="1" />
<label for="bill_to_co" style="cursor:pointer">Same as Company Address</label>
</div>
</td>
</tr>
<tr class="subTable">
<td colspan="2">
<div style="background-color: #EEEEEE; border: 1px solid #CCCCCC; padding: 10px;" class="subTableDiv">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td class="label"><label for="bill_first_name">First Name:</label></td>
<td class="field">
<input maxlength="40" class="billingRequired" name="bill_first_name" size="20" type="text" tabindex="2" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="bill_last_name">Last Name:</label></td>
<td class="field">
<input maxlength="40" class="billingRequired" name="bill_last_name" size="20" type="text" tabindex="3" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="bill_email">Email:</label></td>
<td class="field">
<input maxlength="40" class="billingRequired email" remote="emails.action" name="email" size="20" type="text" tabindex="4" value="" />
<div class="formError"></div>
</td>
</tr>
<tr>
<td class="label"><label for="bill_address1">Address:</label></td>
<td class="field">
<input maxlength="40" class="billingRequired" name="bill_address1" size="20" type="text" tabindex="5" value="" />
</td>
</tr>
<tr>
<td class="label"></td>
<td class="field">
<input maxlength="40" name="bill_address2" size="20" type="text" tabindex="6" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="bill_city">City:</label></td>
<td class="field">
<input maxlength="40" class="billingRequired" name="bill_city" size="20" type="text" tabindex="7" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="bill_state">State:</label></td>
<td class="field">
<select id="bill_state" class="billingRequired" name="bill_state" style="margin-left: 4px;" tabindex="8">
<option value="">Choose State</option>
<option value="AL">Alabama</option><option value="AK">Alaska</option><option value="AZ">Arizona</option><option value="AR">Arkansas</option><option value="CA">California</option><option value="CO">Colorado</option><option value="CT">Connecticut</option><option value="DE">Delaware</option><option value="FL">Florida</option><option value="GA">Georgia</option><option value="HI">Hawaii</option><option value="ID">Idaho</option><option value="IL">Illinois</option><option value="IN">Indiana</option><option value="IA">Iowa</option><option value="KS">Kansas</option><option value="KY">Kentucky</option><option value="LA">Louisiana</option><option value="ME">Maine</option><option value="MD">Maryland</option><option value="MA">Massachusetts</option><option value="MI">Michigan</option><option value="MN">Minnesota</option><option value="MS">Mississippi</option><option value="MO">Missouri</option><option value="MT">Montana</option><option value="NE">Nebraska</option><option value="NV">Nevada</option><option value="NH">New Hampshire</option><option value="NJ">New Jersey</option><option value="NM">New Mexico</option><option value="NY">New York</option><option value="NC">North Carolina</option><option value="ND">North Dakota</option><option value="OH">Ohio</option><option value="OK">Oklahoma</option><option value="OR">Oregon</option><option value="PA">Pennsylvania</option><option value="RI">Rhode Island</option><option value="SC">South Carolina</option><option value="SD">South Dakota</option><option value="TN">Tennessee</option><option value="TX">Texas</option><option value="UT">Utah</option><option value="VT">Vermont</option><option value="VA">Virginia</option><option value="WA">Washington</option><option value="WV">West Virginia</option><option value="WI">Wisconsin</option><option value="WY">Wyoming</option>
</select>
</td>
</tr>
<tr>
<td class="label"><label for="bill_zip">Zip:</label></td>
<td class="field">
<input maxlength="10" class="billingRequired zipcode" name="bill_zip" style="width: 100px" type="text" class="zipcode" tabindex="9" value="" />
</td>
</tr>
<tr>
<td class="label"><label for="bill_phone">Phone:</label></td>
<td class="field">
<input maxlength="14" class="billingRequired phone" name="bill_phone" style="width: 100px" type="text" class="phone" tabindex="10" value="" />
</td>
</tr>
</table>
</div>
</td>
</tr>
<tr>
<td class="label">Credit Card Type:</td>
<td class="field">
<select id="cc_type" class="required" name="cc_type" class="creditCardType" tabindex="11">
<option value="">Choose Credit Card</option>
<option value="amex">American Express</option>
<option value="discover">Discover</option>
<option value="mastercard">MasterCard</option>
<option value="visa">Visa</option>
</select>
</td>
</tr>
<tr>
<td class="label">Expiration:</td>
<td class="field">
<select id="cc_exp_month" name="cc_exp_month" title="ExpirationMonth" tabindex="12">
<option value="01">01 - Jan</option>
<option value="02">02 - Feb</option>
<option value="03">03 - Mar</option>
<option value="04">04 - Apr</option>
<option value="05">05 - May</option>
<option value="06">06 - Jun</option>
<option value="07">07 - Jul</option>
<option value="08">08 - Aug</option>
<option value="09">09 - Sep</option>
<option value="10">10 - Oct</option>
<option value="11">11 - Nov</option>
<option value="12">12 - Dec</option>
</select>
<select id="cc_exp_year" name="cc_exp_year" title="ExpirationYear" tabindex="13">
<option value="2007">2007</option>
<option value="2008" selected="selected">2008</option>
<option value="2009">2009</option>
<option value="2010">2010</option>
<option value="2011">2011</option>
<option value="2012">2012</option>
<option value="2013">2013</option>
<option value="2014">2014</option>
<option value="2015">2015</option>
<option value="2016">2016</option>
</select>
</td>
</tr>
<tr>
<td class="label"><label for="credit_card">Credit Card Number:</label></td>
<td class="field">
<input maxlength="40" id="creditcard" class="required" name="credit_card" size="20" type="text" tabindex="14" />
</td>
</tr>
<tr>
<td class="label"><label for="cc_cvv">Security Code:</label></td>
<td class="field">
<input id="ccNumber" class="required" maxlength="4" name="cc_cvv" style="width: 30px;" type="text" style="vertical-align: top;" tabindex="16" value="" />
</td>
</tr>
<tr>
<td></td>
<td>
<div class="buttonSubmit">
<span></span>
<input class="formButton" type="submit" value="Finish" style="width: 180px" />
</div><br clear="all"/>
</td>
</tr>
</table>
</form>
<br clear="all" />
</div>
</div> <!-- end main content -->
<br />
</div> <!-- end col-main -->
<!-- start left col -->
<div id="col-left" class="nav-left-back empty resize" style="position: absolute; min-height: 450px;">
<div class="col-left-header-tab" style="position: absolute;">Signup</div>
<div class="nav-left">
</div>
<div class="left-nav-callout png" style="top: 15px; margin-bottom: 100px;">
<img src="images/left-nav-callout-long.png" class="png" alt="" />
<h6>Sign Up Process</h6>
<a style="background-image: url(images/step1-24.gif); font-weight: normal; text-decoration: none; cursor: default;">Sign up with a valid credit card.</a>
<a style="background-image: url(images/step2-24.gif); font-weight: normal; text-decoration: none; cursor: default;">Connect to your Google AdWords account. You will need your AdWords Customer ID.</a>
<a target="_blank" style="background-image: url(images/step3-24.gif); font-weight: normal; text-decoration: none; cursor: default;">Start your 30 day trial. No payments until trial ends.</a>
</div>
<div class="footerAddress">
<b>Marketo Inc.</b><br />
1710 S. Amphlett Blvd.<br />
San Mateo, CA 94402 USA<br />
</div>
<br clear="all"/>
</div> <!-- end left col -->
</div> </div> <!-- end page container 2 divs-->
<div id="footer-container" align="center">
<div class="footer">
<ul>
<li><a href="..">Home</a></li>
<li class="line-off"><a href=".">Back to first step</a></li>
</ul>
</div></div>
<!-- end page wrapper -->
</div>
</body>
</html>

File diff suppressed because it is too large Load Diff

Binary file not shown.

After

Width:  |  Height:  |  Size: 73 B

View File

@@ -0,0 +1,233 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Remember The Milk signup form - jQuery Validate plugin demo - with friendly permission from the RTM team</title>
<link rel="stylesheet" href="milk.css" />
<script src="../../lib/jquery.js"></script>
<script src="../../lib/jquery.mockjax.js"></script>
<script src="../../dist/jquery.validate.js"></script>
<script>
$(document).ready(function() {
$.mockjax({
url: "emails.action",
response: function(settings) {
var email = settings.data.email,
emails = ["glen@marketo.com", "george@bush.gov", "me@god.com", "aboutface@cooper.com", "steam@valve.com", "bill@gates.com"];
this.responseText = "true";
if ( $.inArray( email, emails ) !== -1 ) {
this.responseText = "false";
}
},
responseTime: 500
});
$.mockjax({
url: "users.action",
response: function(settings) {
var user = settings.data.username,
users = ["asdf", "Peter", "Peter2", "George"];
this.responseText = "true";
if ( $.inArray( user, users ) !== -1 ) {
this.responseText = "false";
}
},
responseTime: 500
});
// validate signup form on keyup and submit
var validator = $("#signupform").validate({
rules: {
firstname: "required",
lastname: "required",
username: {
required: true,
minlength: 2,
remote: "users.action"
},
password: {
required: true,
minlength: 5
},
password_confirm: {
required: true,
minlength: 5,
equalTo: "#password"
},
email: {
required: true,
email: true,
remote: "emails.action"
},
dateformat: "required",
terms: "required"
},
messages: {
firstname: "Enter your firstname",
lastname: "Enter your lastname",
username: {
required: "Enter a username",
minlength: jQuery.validator.format("Enter at least {0} characters"),
remote: jQuery.validator.format("{0} is already in use")
},
password: {
required: "Provide a password",
rangelength: jQuery.validator.format("Enter at least {0} characters")
},
password_confirm: {
required: "Repeat your password",
minlength: jQuery.validator.format("Enter at least {0} characters"),
equalTo: "Enter the same password as above"
},
email: {
required: "Please enter a valid email address",
minlength: "Please enter a valid email address",
remote: jQuery.validator.format("{0} is already in use")
},
dateformat: "Choose your preferred dateformat",
terms: " "
},
// the errorPlacement has to take the table layout into account
errorPlacement: function(error, element) {
if ( element.is(":radio") )
error.appendTo( element.parent().next().next() );
else if ( element.is(":checkbox") )
error.appendTo ( element.next() );
else
error.appendTo( element.parent().next() );
},
// specifying a submitHandler prevents the default submit, good for the demo
submitHandler: function() {
alert("submitted!");
},
// set this class to error-labels to indicate valid fields
success: function(label) {
// set &nbsp; as text for IE
label.html("&nbsp;").addClass("checked");
},
highlight: function(element, errorClass) {
$(element).parent().next().find("." + errorClass).removeClass("checked");
}
});
// propose username by combining first- and lastname
$("#username").focus(function() {
var firstname = $("#firstname").val();
var lastname = $("#lastname").val();
if(firstname && lastname && !this.value) {
this.value = (firstname + "." + lastname).toLowerCase();
}
});
});
</script>
</head>
<body>
<h1 id="banner"><a href="http://bassistance.de/jquery-plugins/jquery-plugin-validation/">jQuery Validation Plugin</a> Demo</h1>
<div id="main">
<div id="content">
<div id="header">
<div id="headerlogo"><img src="milk.png" alt="Remember The Milk" /></div>
</div>
<div style="clear: both;"><div></div></div>
<div class="content">
<div id="signupbox">
<div id="signuptab">
<ul>
<li id="signupcurrent"><a href=" ">Signup</a></li>
</ul>
</div>
<div id="signupwrap">
<form id="signupform" autocomplete="off" method="get" action="">
<table>
<tr>
<td class="label"><label id="lfirstname" for="firstname">First Name</label></td>
<td class="field"><input id="firstname" name="firstname" type="text" value="" maxlength="100" /></td>
<td class="status"></td>
</tr>
<tr>
<td class="label"><label id="llastname" for="lastname">Last Name</label></td>
<td class="field"><input id="lastname" name="lastname" type="text" value="" maxlength="100" /></td>
<td class="status"></td>
</tr>
<tr>
<td class="label"><label id="lusername" for="username">Username</label></td>
<td class="field"><input id="username" name="username" type="text" value="" maxlength="50" /></td>
<td class="status"></td>
</tr>
<tr>
<td class="label"><label id="lpassword" for="password">Password</label></td>
<td class="field"><input id="password" name="password" type="password" maxlength="50" value="" /></td>
<td class="status"></td>
</tr>
<tr>
<td class="label"><label id="lpassword_confirm" for="password_confirm">Confirm Password</label></td>
<td class="field"><input id="password_confirm" name="password_confirm" type="password" maxlength="50" value="" /></td>
<td class="status"></td>
</tr>
<tr>
<td class="label"><label id="lemail" for="email">Email Address</label></td>
<td class="field"><input id="email" name="email" type="text" value="" maxlength="150" /></td>
<td class="status"></td>
</tr>
<tr>
<td class="label"><label>Which Looks Right</label></td>
<td class="field" colspan="2" style="vertical-align: top; padding-top: 2px;">
<table>
<tbody>
<tr>
<td style="padding-right: 5px;">
<input id="dateformat_eu" name="dateformat" type="radio" value="0" />
<label id="ldateformat_eu" for="dateformat_eu">14/02/07</label>
</td>
<td style="padding-left: 5px;">
<input id="dateformat_am" name="dateformat" type="radio" value="1" />
<label id="ldateformat_am" for="dateformat_am">02/14/07</label>
</td>
<td>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td class="label">&nbsp;</td>
<td class="field" colspan="2">
<div id="termswrap">
<input id="terms" type="checkbox" name="terms" />
<label id="lterms" for="terms">I have read and accept the Terms of Use.</label>
</div> <!-- /termswrap -->
</td>
</tr>
<tr>
<td class="label"><label id="lsignupsubmit" for="signupsubmit">Signup</label></td>
<td class="field" colspan="2">
<input id="signupsubmit" name="signup" type="submit" value="Signup" />
</td>
</tr>
</table>
</form>
</div>
</div>
</div>
</div>
</div>
</body>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 538 B

View File

@@ -0,0 +1,236 @@
/* GENERAL ELEMENTS */
* { margin: 0; padding: 0; }
body, input, select, textarea { font-family: verdana, arial, helvetica, sans-serif; font-size: 11px; }
body { color: #333; background-color: #fff; text-align: center; }
a:link { color:#0060BF; text-decoration: underline; }
a:visited { color:#0060BF; text-decoration: underline; }
a:active { color:#0060BF; text-decoration: underline; }
a:hover { color:#000000; text-decoration: underline; }
h1, h2, h3, h4, h5, h6 { font-family: "Lucida Grande", "Lucida Sans Unicode", geneva, verdana, arial, helvetica, sans-serif; font-weight: bold; color: #666; }
h1 { font-size: 1.8em; margin: 0em 0em 0.6em 0em; color: #EC5800; }
h2 { font-size: 1.5em; margin: 1.2em 0em 0.4em 0em; }
h3 { font-size: 1.4em; margin: 1.2em 0em 0.4em 0em; color: #EC5800; }
h4 { font-size: 1.2em; margin: 1.2em 0em 0.4em 0em; }
h5 { font-size: 1.0em; margin: 1.2em 0em 0.4em 0em; }
h6 { font-size: 0.8em; margin: 1.2em 0em 0.4em 0em; }
img { border: 0px; }
p { font-size: 1.0em; line-height: 1.3em; margin: 1.2em 0em 1.2em 0em; }
li > p { margin-top: 0.2em; }
pre { font-family: monospace; font-size: 1.0em; }
strong, b { font-weight: bold; }
/* PAGE ELEMENTS */
/* Content */
#content { margin: 0em auto; width: 765px; padding: 10px 0 10px 0; text-align: left; /* Win IE5 */ }
.content { margin-left: 4.5em; margin-right: 4.5em; }
.content ol, .content ul, .content li { font-size: 1.0em; line-height: 1.3em; margin: 0.2em 0 0.1em 1.5em; }
.content ol.terms li { margin-bottom: 1em; }
/* Header */
#header { padding-bottom: 10em; }
#headerlogo { float: left; }
#headerlogo img { width: 188px; height: 83px; }
#headernav { float: right; }
label { font-weight: bold; }
#reminders label { font-weight: normal; }
table.tabbedtable { padding-left: 3em; }
table.tabbedtable td { padding-bottom: 5px; }
table.tabbedtable label { text-align: right; padding-right: 9px; }
.hiddenlabel { visibility: hidden; }
.largelink { border: 1px solid #cacaca; padding: 10px; background-color: #E8EEF7; font-size: 1.2em; font-weight: bold; }
.largelinkwrap { padding-top: 10px; padding-bottom: 10px; }
#signuptab {
float:left;
width:100%;
background:#fff url("bg.gif") repeat-x bottom;
font-size: 1.0em;
line-height: normal;
}
#signuptab ul {
margin:0;
padding: 0px 10px 0px 10px;
list-style:none;
}
#signuptab li {
float:left;
background:url("left_white.png") no-repeat left top;
margin:0;
padding:0 3px 0 9px;
border-bottom:1px solid #CACACA;
}
#signuptab a {
float:left;
display:block;
width:.1em;
background:url("right_white.png") no-repeat right top;
padding:2px 15px 0px 6px;
text-decoration:none;
font-weight:bold;
color:#fff;
white-space: nowrap;
}
#signuptab > ul a {width:auto;}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#signuptab a {float:none;}
/* End IE5-Mac hack */
#signuptab a:hover {
color:#333;
}
#signuptab #signupcurrent {
background-position:0 -150px;
border-width:0;
}
#signuptab #signupcurrent a {
background-position:100% -150px;
padding-bottom:1px;
color:#000;
}
#signuptab li:hover, #signuptab li:hover a {
background-position:0% -150px;
color:#000;
}
#signuptab li:hover a {
background-position:100% -150px;
}
/* Signup box */
#signupbox {
width: 100%;
text-align: center;
margin: 0em auto;
}
#signupwrap {
border: 1px solid #CACACA;
border-top: 0;
text-align: left;
padding: 35px 10px 20px 30px;
clear: both;
}
/* Unsupported browsers */
.orange_rbcontent { padding: 0.4em; }
.orange_rbroundbox { width: 100%; }
#unsupported {
font-weight: bold;
text-align: left;
}
/*#content {
padding-top: 15px;
}*/
/* Signup form */
#signupform table {
border-spacing: 0px;
border-collapse: collapse;
empty-cells: show;
}
#signupform .label {
padding-top: 2px;
padding-right: 8px;
vertical-align: top;
text-align: right;
width: 125px;
white-space: nowrap;
}
#signupform .field {
padding-bottom: 10px;
white-space: nowrap;
}
#signupform .status {
padding-top: 2px;
padding-left: 8px;
vertical-align: top;
width: 246px;
white-space: nowrap;
}
#signupform .textfield {
width: 150px;
}
#signupform label.error {
background:url("../images/unchecked.gif") no-repeat 0px 0px;
padding-left: 16px;
padding-bottom: 2px;
font-weight: bold;
color: #EA5200;
}
#signupform label.checked {
background:url("../images/checked.gif") no-repeat 0px 0px;
}
#signupform .success_msg {
font-weight: bold;
color: #0060BF;
margin-left: 19px;
}
#signupform #dateformatStatus, #signupform #termsStatus {
margin-left: 6px;
}
#signupform #dateformat_eu {
vertical-align: middle;
}
#signupform #ldateformat_eu {
font-weight: normal;
vertical-align: middle;
}
#signupform #dateformat_am {
vertical-align: middle;
}
#signupform #ldateformat_am {
font-weight: normal;
vertical-align: middle;
}
#signupform #termswrap {
float: left;
}
#signupform #terms {
vertical-align: middle;
float: left;
display: block;
margin-right: 5px;
}
#signupform #lterms {
font-weight: normal;
vertical-align: middle;
float: left;
display: block;
width: 350px;
white-space: normal;
}
#signupform #lsignupsubmit {
visibility: hidden;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@@ -0,0 +1,410 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery accordion form with validation</title>
<script src="../../lib/jquery.js"></script>
<script src="../../dist/jquery.validate.js"></script>
<script src="../marketo/jquery.maskedinput.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#recordClientPhone").mask("(999) 999-9999");
$("#recordClientPhoneAlt").mask("(999) 999-9999");
$("#recordClientZip").mask("99999");
$("#recordPropertyZip").mask("99999");
$("#recordPurchaseZip").mask("99999");
// add * to required field labels
$('label.required').append('&nbsp;<strong>*</strong>&nbsp;');
// accordion functions
var accordion = $("#stepForm").accordion();
var current = 0;
$.validator.addMethod("pageRequired", function(value, element) {
var $element = $(element)
function match(index) {
return current == index && $(element).parents("#sf" + (index + 1)).length;
}
if (match(0) || match(1) || match(2)) {
return !this.optional(element);
}
return "dependency-mismatch";
}, $.validator.messages.required)
var v = $("#cmaForm").validate({
errorClass: "warning",
onkeyup: false,
onfocusout: false,
submitHandler: function() {
alert("Submitted, thanks!");
}
});
// back buttons do not need to run validation
$("#sf2 .prevbutton").click(function(){
accordion.accordion("option", "active", 0);
current = 0;
});
$("#sf3 .prevbutton").click(function(){
accordion.accordion("option", "active", 1);
current = 1;
});
// these buttons all run the validation, overridden by specific targets above
$(".open2").click(function() {
if (v.form()) {
accordion.accordion("option", "active", 2);
current = 2;
}
});
$(".open1").click(function() {
if (v.form()) {
accordion.accordion("option", "active", 1);
current = 1;
}
});
$(".open0").click(function() {
if (v.form()) {
accordion.accordion("option", "active", 0);
current = 0;
}
});
});
</script>
<link rel="stylesheet" type="text/css" media="screen" href="style.css" />
</head>
<body>
<div id="wrap">
<div id="main">
<h1 class="top bottom"><span>Help me</span> Buy and Sell a House</h1>
<h2>This form is quick &amp; easy to complete - in only 3 steps!</h2>
<form name="cmaForm" id="cmaForm" method="post">
<input type="hidden" name="recordRequestPrimaryServiceID" id="recordRequestPrimaryServiceID" value="100" />
<input type="hidden" name="recordClientServices" id="recordClientServices" value="1,3" />
<ul id="stepForm" class="ui-accordion-container">
<li id="sf1"><a href='#' class="ui-accordion-link"> </a>
<div>
<fieldset><legend> Step 1 of 3 </legend>
<div class="requiredNotice">*Required Field</div>
<h3 class="stepHeader">Tell us about the property you're buying</h3>
<label for="recordPurchaseMetRealtor" class="input required">Are you currently working with a<br />
real estate agent? </label> &nbsp;&nbsp;No: <input name="recordPurchaseMetRealtor" type="radio" checked="checked" class="inputclass" value="0" /> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Yes: <input name="recordPurchaseMetRealtor" type="radio" class="inputclass pageRequired" value="1" title="Please choose Yes or No" />
<div class="formspacer"></div>
<label for="recordPurchaseTimeFrameID" class="input required">When would you like to move?</label> <select name="recordPurchaseTimeFrameID" id="recordPurchaseTimeFrameID" class="inputclass pageRequired" title="Select a Time Frame">
<option value="">-Select-</option>
<option value="1">Less than 3 months</option>
<option value="2">3-6 months</option>
<option value="3">6-9 months</option>
<option value="4">9-12 months</option>
<option value="5">Over 12 months</option>
</select> <br />
<label for="recordPurchasePriceRangeID" class="input required">Purchase price range:</label> <select name="recordPurchasePriceRangeID" id="recordPurchasePriceRangeID" class="inputclass pageRequired" title="Select a Price Range">
<option value="">-Select-</option>
<option value="1"></option>
<option value="2">$75,000 - $100,000</option>
<option value="3">$100,000 - $125,000</option>
<option value="4">$125,000 - $150,000</option>
<option value="5">$150,000 - $200,000</option>
<option value="6">$200,000 - $250,000</option>
<option value="7">$250,000 - $300,000</option>
<option value="8">$300,000 - $350,000</option>
<option value="9">$350,000 - $400,000</option>
<option value="10">$400,000 - $500,000</option>
<option value="11">$500,000 - $700,000</option>
<option value="12">$700,000 - $900,000</option>
<option value="13">> $900,000</option>
</select> <br />
<label for="recordPurchaseState" class="input required">State:</label> <select name="recordPurchaseState" id="recordPurchaseState" class="inputclass pageRequired" title="Select a State">
<option value="">-Select-</option>
<option value="AL">Alabama</option>
<option value="AK">Alaska</option>
<option value="AZ">Arizona</option>
<option value="AR">Arkansas</option>
<option value="CA">California</option>
<option value="CO">Colorado</option>
<option value="CT">Connecticut</option>
<option value="DE">Delaware</option>
<option value="DC">Dist of Columbia</option>
<option value="FL">Florida</option>
<option value="GA">Georgia</option>
<option value="HI">Hawaii</option>
<option value="ID">Idaho</option>
<option value="IL">Illinois</option>
<option value="IN">Indiana</option>
<option value="IA">Iowa</option>
<option value="KS">Kansas</option>
<option value="KY">Kentucky</option>
<option value="LA">Louisiana</option>
<option value="ME">Maine</option>
<option value="MD">Maryland</option>
<option value="MA">Massachusetts</option>
<option value="MI">Michigan</option>
<option value="MN">Minnesota</option>
<option value="MS">Mississippi</option>
<option value="MO">Missouri</option>
<option value="MT">Montana</option>
<option value="NE">Nebraska</option>
<option value="NV">Nevada</option>
<option value="NH">New Hampshire</option>
<option value="NJ">New Jersey</option>
<option value="NM">New Mexico</option>
<option value="NY">New York</option>
<option value="NC">North Carolina</option>
<option value="ND">North Dakota</option>
<option value="OH">Ohio</option>
<option value="OK">Oklahoma</option>
<option value="OR">Oregon</option>
<option value="PA" selected="selected">Pennsylvania</option>
<option value="RI">Rhode Island</option>
<option value="SC">South Carolina</option>
<option value="SD">South Dakota</option>
<option value="TN">Tennessee</option>
<option value="TX">Texas</option>
<option value="UT">Utah</option>
<option value="VT">Vermont</option>
<option value="VA">Virginia</option>
<option value="WA">Washington</option>
<option value="WV">West Virginia</option>
<option value="WI">Wisconsin</option>
<option value="WY">Wyoming</option>
</select> <br />
<label for="recordPurchasePropertyTypeID" class="input">Desired property type:</label> <select name="recordPurchasePropertyTypeID" id="recordPurchasePropertyTypeID" class="inputclass" title="Select a Property Type">
<option value="">-Select-</option>
<option value="1">Single Family Detached</option>
<option value="2">Condo</option>
<option value="3">Townhouse</option>
<option value="4">Rental</option>
<option value="5">Multi-Family</option>
<option value="6">Vacation Home</option>
<option value="7">Other</option>
</select> <br />
<div class="buttonWrapper"><input name="formNext1" type="button" class="open1 nextbutton" value="Next" alt="Next" title="Next" /></div>
</fieldset>
</div>
</li>
<li id="sf2">
<a href='#' class="ui-accordion-link">
</a>
<div>
<fieldset><legend> Step 2 of 3 </legend>
<div class="requiredNotice">*Required Field</div>
<h3 class="stepHeader">Tell us about the property you're selling</h3>
<label for="recordClientTimeFrameID" class="input required">When would you like to sell?</label> <select name="recordClientTimeFrameID" id="recordClientTimeFrameID" class="inputclass pageRequired" title="Select a Time Frame">
<option value="">-Select-</option>
<option value="1">Less than 3 months</option>
<option value="2">3-6 months</option>
<option value="3">6-9 months</option>
<option value="4">9-12 months</option>
<option value="5">Over 12 months</option>
</select> <br />
<label for="recordClientHomeTypeID" class="input required">Type of property you are selling:</label> <select name="recordClientHomeTypeID" id="recordClientHomeTypeID" class="inputclass pageRequired" title="Select a Property Type">
<option value="">-Select-</option>
<option value="1">Single Family Detached</option>
<option value="2">Condo</option>
<option value="3">Townhouse</option>
<option value="4">Rental</option>
<option value="5">Multi-Family</option>
<option value="6">Vacation Home</option>
<option value="7">Other</option>
</select> <br />
<label for="recordPropertyAddress1" class="input required">Property Street Address:</label> <input name="recordPropertyAddress1" id="recordPropertyAddress1" class="inputclass pageRequired" title="Street Address is required" maxlength="254" onblur="recordClientAddress1.value = this.value" /><br />
<label for="recordPropertyAddress2" class="input">Address (2):</label> <input name="recordPropertyAddress2" id="recordPropertyAddress2" class="inputclass" maxlength="254" onblur="recordClientAddress2.value = this.value" /><br />
<label for="recordPropertyCity" class="input required">City:</label> <input name="recordPropertyCity" id="recordPropertyCity" class="inputclass pageRequired" title="City is required" maxlength="254" onblur="recordClientCity.value = this.value" /><br />
<label for="recordPropertyState" class="input required">State:</label> <select name="recordPropertyState" id="recordPropertyState" class="inputclass pageRequired" title="Select a State" onchange="recordClientState.value = this.value">
<option value="">-Select-</option>
<option value="AL">Alabama</option>
<option value="AK">Alaska</option>
<option value="AZ">Arizona</option>
<option value="AR">Arkansas</option>
<option value="CA">California</option>
<option value="CO">Colorado</option>
<option value="CT">Connecticut</option>
<option value="DE">Delaware</option>
<option value="DC">Dist of Columbia</option>
<option value="FL">Florida</option>
<option value="GA">Georgia</option>
<option value="HI">Hawaii</option>
<option value="ID">Idaho</option>
<option value="IL">Illinois</option>
<option value="IN">Indiana</option>
<option value="IA">Iowa</option>
<option value="KS">Kansas</option>
<option value="KY">Kentucky</option>
<option value="LA">Louisiana</option>
<option value="ME">Maine</option>
<option value="MD">Maryland</option>
<option value="MA">Massachusetts</option>
<option value="MI">Michigan</option>
<option value="MN">Minnesota</option>
<option value="MS">Mississippi</option>
<option value="MO">Missouri</option>
<option value="MT">Montana</option>
<option value="NE">Nebraska</option>
<option value="NV">Nevada</option>
<option value="NH">New Hampshire</option>
<option value="NJ">New Jersey</option>
<option value="NM">New Mexico</option>
<option value="NY">New York</option>
<option value="NC">North Carolina</option>
<option value="ND">North Dakota</option>
<option value="OH">Ohio</option>
<option value="OK">Oklahoma</option>
<option value="OR">Oregon</option>
<option value="PA" selected="selected">Pennsylvania</option>
<option value="RI">Rhode Island</option>
<option value="SC">South Carolina</option>
<option value="SD">South Dakota</option>
<option value="TN">Tennessee</option>
<option value="TX">Texas</option>
<option value="UT">Utah</option>
<option value="VT">Vermont</option>
<option value="VA">Virginia</option>
<option value="WA">Washington</option>
<option value="WV">West Virginia</option>
<option value="WI">Wisconsin</option>
<option value="WY">Wyoming</option>
</select> <br />
<label for="recordPropertyZip" class="input required">Zip:</label> <input name="recordPropertyZip" id="recordPropertyZip" class="inputclass pageRequired" title="Zip Code is required" maxlength="254" onblur="recordClientZip.value = this.value" /><br />
<label for="recordClientPropertyValueID" class="input required">Estimated Market Value:</label> <select name="recordClientPropertyValueID" id="recordClientPropertyValueID" class="inputclass pageRequired" title="Select a Price Range">
<option value="">-Select-</option>
<option value="1">Less Than $75K</option>
<option value="2">$75-$100K</option>
<option value="3">$100-$125K</option>
<option value="4">$125-$150K</option>
<option value="5">$150-$200K</option>
<option value="6">$200-$250K</option>
<option value="7">$250-$300K</option>
<option value="8">$300-$350K</option>
<option value="9">$350-$400K</option>
<option value="10">$400-$500K</option>
<option value="11">$500-$700K</option>
<option value="12">$700-$900K</option>
<option value="13">Over $900K</option>
</select> <br />
<label for="recordPropertyBedroomsID" class="input">Bedrooms:</label> <select name="recordPropertyBedroomsID" id="recordPropertyBedroomsID" class="inputclass">
<option value="">-Select-</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5+</option>
</select> <br />
<label for="recordPropertyBathroomsId" class="input">Bathrooms:</label> <select name="recordPropertyBathroomsId" id="recordPropertyBathroomsId" class="inputclass">
<option value="">-Select-</option>
<option value="1">1</option>
<option value="2">1.5</option>
<option value="3">2</option>
<option value="4">2.5</option>
<option value="5">3</option>
<option value="6">3.5</option>
<option value="7">4+</option>
</select> <br />
<label for="recordPropertyAgeId" class="input">Approx. Age of Home:</label> <select name="recordPropertyAgeId" id="recordPropertyAgeId" class="inputclass">
<option value="">-Select-</option>
<option value="1">Less Than 1 year</option>
<option value="2">1-5 years</option>
<option value="3">6-10 years</option>
<option value="4">11-15 years</option>
<option value="5">More than 15 years</option>
</select> <br />
<label for="recordPropertySqFt" class="input">Approx. Square Footage:</label> <input name="recordPropertySqFt" id="recordPropertySqFt" class="inputclass" maxlength="254" /><br />
<div class="buttonWrapper"><input name="formBack0" type="button" class="open0 prevbutton" value="Back" alt="Back" title="Back" /> <input name="formNext2" type="button" class="open2 nextbutton" value="Next" alt="Next" title="Next" /></div>
</fieldset>
</div>
</li>
<li id="sf3">
<a href='#' class="ui-accordion-link">
</a>
<div>
<fieldset><legend> Step 3 of 3 </legend>
<div class="requiredNotice">*Required Field</div>
<h3 class="stepHeader">Tell us about yourself</h3>
<label for="recordClientNameFirst" class="input required">First Name:</label> <input name="recordClientNameFirst" id="recordClientNameFirst" class="inputclass pageRequired" title="First Name is required" maxlength="254" /> <br />
<label for="recordClientNameLast" class="input required">Last Name:</label> <input name="recordClientNameLast" id="recordClientNameLast" class="inputclass pageRequired" maxlength="254" title="Last Name is required" /> <br />
<label for="recordClientAddress1" class="input required">Current Address:</label> <input name="recordClientAddress1" id="recordClientAddress1" class="inputclass pageRequired" maxlength="254" title="Address is required" /> <br />
<label for="recordClientAddress2" class="input">Address (2):</label> <input name="recordClientAddress2" id="recordClientAddress2" class="inputclass" maxlength="254" /> <br />
<label for="recordClientCity" class="input required">City:</label> <input name="recordClientCity" id="recordClientCity" class="inputclass pageRequired" maxlength="254" title="City is required" /> <br />
<label for="recordClientState" class="input required">State:</label> <select name="recordClientState" id="recordClientState" class="inputclass pageRequired" title="Select a State">
<option value="">-Select-</option>
<option value="AL">Alabama</option>
<option value="AK">Alaska</option>
<option value="AZ">Arizona</option>
<option value="AR">Arkansas</option>
<option value="CA">California</option>
<option value="CO">Colorado</option>
<option value="CT">Connecticut</option>
<option value="DE">Delaware</option>
<option value="DC">Dist of Columbia</option>
<option value="FL">Florida</option>
<option value="GA">Georgia</option>
<option value="HI">Hawaii</option>
<option value="ID">Idaho</option>
<option value="IL">Illinois</option>
<option value="IN">Indiana</option>
<option value="IA">Iowa</option>
<option value="KS">Kansas</option>
<option value="KY">Kentucky</option>
<option value="LA">Louisiana</option>
<option value="ME">Maine</option>
<option value="MD">Maryland</option>
<option value="MA">Massachusetts</option>
<option value="MI">Michigan</option>
<option value="MN">Minnesota</option>
<option value="MS">Mississippi</option>
<option value="MO">Missouri</option>
<option value="MT">Montana</option>
<option value="NE">Nebraska</option>
<option value="NV">Nevada</option>
<option value="NH">New Hampshire</option>
<option value="NJ">New Jersey</option>
<option value="NM">New Mexico</option>
<option value="NY">New York</option>
<option value="NC">North Carolina</option>
<option value="ND">North Dakota</option>
<option value="OH">Ohio</option>
<option value="OK">Oklahoma</option>
<option value="OR">Oregon</option>
<option value="PA" selected="selected">Pennsylvania</option>
<option value="RI">Rhode Island</option>
<option value="SC">South Carolina</option>
<option value="SD">South Dakota</option>
<option value="TN">Tennessee</option>
<option value="TX">Texas</option>
<option value="UT">Utah</option>
<option value="VT">Vermont</option>
<option value="VA">Virginia</option>
<option value="WA">Washington</option>
<option value="WV">West Virginia</option>
<option value="WI">Wisconsin</option>
<option value="WY">Wyoming</option>
</select> <br />
<label for="recordClientZip" class="input required">Zip:</label> <input name="recordClientZip" id="recordClientZip" class="inputclass pageRequired" maxlength="12" title="Zip Code is required" /> <br />
<label for="recordClientPhone" class="input required">Phone Number:</label> <input name="recordClientPhone" id="recordClientPhone" class="inputclass pageRequired" maxlength="254" title="Phone Number is required" /> <br />
<label for="recordClientPhoneAlt" class="input">Alternate Number:</label> <input name="recordClientPhoneAlt" id="recordClientPhoneAlt" class="inputclass" maxlength="254" /> <br />
<label for="recordClientEmail" class="input required">Email Address:</label> <input name="recordClientEmail" id="recordClientEmail" class="inputclass pageRequired email" maxlength="254" title="Email address is required" /> <br />
<label for="recordClientEmail1" class="input required">Confirm Email:</label> <input name="recordClientEmail1" id="recordClientEmail1" class="inputclass pageRequired" equalTo:"'#recordClientEmail" maxlength="254" title="Please confirm your email address" /> <br />
<br />
<p class="formDisclaimer">This is a sample form, no information is sent anywhere.</p>
<div class="buttonWrapper"><input name="formBack1" type="button" class="open1 prevbutton" value="Back" alt="Back" title="Back" /> <input name="submit" type="submit" id="submit" value="Submit" class="submitbutton" alt="Submit" title="Submit"></div>
</fieldset>
</div>
</li>
</ul>
</form>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,705 @@
/********************************************
AUTHOR: Erwin Aligam
WEBSITE: http://www.styleshout.com/
TEMPLATE NAME: Techmania 1.0
TEMPLATE CODE: S-0003
VERSION: 1.1
*******************************************/
/********************************************
HTML ELEMENTS
********************************************/ /* Top elements */
/** { margin:0; padding: 0; }*/
body {
background-color: #000;
color: #555;
font: 78%/ 1.6 Verdana, 'Trebuchet MS', arial, sans-serif;
text-align: center;
margin: 15px 0;
}
/* links */
a {
color: #213540;
background: inherit;
text-decoration: none;
}
a:hover {
color: #3e4255;
text-decoration: underline;
background: inherit;
}
/* headers */
h1,h2,h3 {
font-family: 'Trebuchet MS', Arial, sans-serif;
font-weight: bold;
}
h1 {
font-size: 1.5em;
margin: 10px 15px;
}
h2 {
font-size: 1.3em;
text-transform: uppercase;
color: #339900;
margin: 10px 15px;
}
h3 {
font-size: 1.1em;
color: #333;
margin: 16px 0 0 18px;
}
h1,h2,h3 {
padding: 0;
}
p {
line-height: 1.4em;
padding: 0 15px;
}
p.error {
color: #CC0033;
}
ul,ol {
margin: 10px 6px;
padding: 0 15px;
color: #006699;
}
ul span,ol span {
color: #666666;
}
/* images */
img {
border: 2px solid #CCC;
}
img.float-right {
margin: 5px 0px 10px 10px;
}
img.float-left {
margin: 5px 10px 10px 0px;
}
code {
margin: 5px 0;
padding: 10px;
text-align: left;
display: block;
overflow: auto;
font: 500 1em/ 1.5em 'Lucida Console', 'courier new', monospace;
/* white-space: pre; */
background: #FAFAFA;
border: 1px solid #EAEAEA;
border-left: 5px solid #72A545;
}
acronym {
cursor: help;
border-bottom: 1px solid #777;
}
blockquote {
margin: 15px;
padding: 0 0 0 32px;
background: #FAFAFA url(quote.gif) no-repeat 5px 10px !important;
background-position: 8px 10px;
border: 1px solid #EAEAEA;
border-left: 5px solid #72A545;
font-weight: bold;
}
/* form elements */
fieldset {
margin: 12px 12px 18px;
padding-left: 6px;
border: 1px solid #004080;
color: #006699;
}
fieldset fieldset {
border: 1px solid #9ea190;
margin: 17px 14px;
}
form {
margin: 10px 15px;
padding: 0;
}
label {
font-weight: bold;
margin: 5px 3px 0 0;
width: 160px;
text-align: right;
float: left;
}
legend {
font-size: 1.2em;
padding: 0 12px;
font-weight: 900;
background-color: #F9F9F9;
}
fieldset fieldset legend {
font-size: 1em;
color: #1a2129;
padding: 0 18px;
margin-left: 75px;
}
input {
padding: 3px;
margin: 4px 0;
border: 1px solid #CFCED3;
font: normal 1em Verdana, sans-serif;
color: #777;
}
textarea {
width: 400px;
padding: 4px;
font: normal 1em Verdana, sans-serif;
border: 1px solid #eee;
height: 100px;
display: block;
color: #777;
}
input.button {
margin: 0;
font: bold 12px Arial, Sans-serif;
border: 1px solid #EAEAEA;
padding: 3px 4px;
background: #CCC url(buttonbg.gif) repeat-x left bottom;
color: #333; /* color: #339900; */
cursor: pointer;
}
input.submitbutton {
background-color: #006699;
color: #FFF;
background-image: none;
font-weight: 900;
border: 1px solid #EAEAEA;
margin: 0 0 0 200px;
}
/* search */
#sidebar #search {
background: #f2f2f2;
margin: 0 15px;
padding: 5px 0;
}
#sidebar #search img {
vertical-align: bottom;
}
#sidebar #search .textbox {
background: #FFF url(input.png) no-repeat top left;
border: 1px solid #EAEAEA;
font-size: 11px;
padding: 3px;
width: 110px;
}
#sidebar #search input.searchbutton {
margin: 0;
font: bold 100% Arial, Sans-serif;
border: 1px solid #CCC;
background: #CCC url(buttonbg.gif) repeat-x left bottom;
padding: 1px;
height: 25px;
color: #333;
width: 55px;
}
/*****************************
LAYOUT
******************************/
#wrap {
margin: 0 auto;
padding: 0;
text-align: left;
background-color: #FFF;
width: 790px;
}
#content-wrap {
clear: both;
margin: 0;
padding: 0;
width: 790px;
}
/* header */
#header {
position: relative;
clear: left;
width: 790px;
height: 137px;
margin: 0;
padding: 0;
background: #000 url(headerbg.jpg) no-repeat left bottom;
}
#header h1#logo-text {
float: right;
margin: 39px 58px 0 0;
padding: 0;
font: bolder 3.2em 'Trebuchet MS', Arial, Sans-serif;
letter-spacing: -2px;
color: #FFF;
text-transform: none;
/* change the values of top and right to adjust the position of the logo*/
top: 35px;
right: 30px;
}
#header h2#slogan {
float: right;
margin: 0 38px 0 0;
padding: 0;
font: bold 1.5em 'Trebuchet MS', Arial, Sans-serif;
text-transform: none;
letter-spacing: 1px;
color: #FFF;
clear: both;
text-align: right;
}
#header h1#logo-text span {
color: #CFCED3;
}
/* menu tabs */
#header #header-tabs {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 25px;
background: #000;
font: bold 1.1em Verdana, Tahoma, 'Trebuchet MS', Sans-serif;
}
#header-tabs ul {
margin: 0;
padding: 2px 0px 0px 0px;
list-style: none;
}
#header-tabs li {
display: inline;
margin: 0;
padding: 0;
}
#header-tabs a {
float: left;
background: url(tableft.gif) no-repeat left top;
margin: 0;
padding: 0 0 0 4px;
text-decoration: none;
}
#header-tabs a span {
float: left;
display: block;
background: url(tabright.gif) no-repeat right top;
padding: 7px 15px 4px 8px;
color: #CCC;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#header-tabs a span {
float: none;
}
/* End IE5-Mac hack */
#header-tabs a:hover span {
color: #FFF;
}
#header-tabs a:hover {
background-position: 0% -42px;
}
#header-tabs a:hover span {
background-position: 100% -42px;
}
#header-tabs #current a {
background-position: 0% -42px;
}
#header-tabs #current a span {
background-position: 100% -42px;
color: #FFF;
}
/* main content */
#main {
width: 748px;
margin: 0;
padding: 8px 16px;
background-color: #F9F9F9;
border-left: 5px solid #000;
border-right: 5px solid #000;
}
#main h1 {
padding: 8px 0 3px 25px;
text-transform: none;
border-bottom: 2px solid #f2f2f2;
color: #339900;
}
/* sidebar */
#sidebar { /* float: right;
width: 245px;
margin: 0 0 10px 0; padding: 0;
background-color: inherit; */
display: none;
}
#sidebar h1 {
padding: 8px 0px 3px 25px;
background: url(square_arrow.gif) no-repeat 0% .7em;
text-transform: none;
color: #339900;
}
#sidebar ul.sidemenu {
list-style: none;
margin: 10px 15px;
padding: 0;
}
#sidebar ul.sidemenu li {
margin-bottom: 1px;
border: 1px solid #f2f2f2;
}
#sidebar ul.sidemenu a {
display: block;
font-weight: bold;
color: #333;
text-decoration: none;
padding: 2px 5px 2px 10px;
background: #f2f2f2;
border-left: 5px solid #CCC;
min-height: 18px;
}
* html body #sidebar ul.sidemenu a {
height: 18px;
}
#sidebar ul.sidemenu a:hover {
padding: 2px 5px 2px 10px;
background: #f2f2f2;
color: #339900;
border-left: 5px solid #72A545;
}
/* footer */
#footer {
clear: both;
height: 40px;
color: #CCC;
background: #000;
margin: 0;
font-size: 92%;
}
#footer a {
text-decoration: none;
font-weight: bold;
color: #FFF;
}
#footer #footer-left {
width: 68%;
float: left;
text-align: left;
margin: 0;
padding: 10px;
}
#footer #footer-right {
width: 25%;
float: right;
text-align: right;
margin: 0;
padding: 10px;
}
/* alignment classes */
.float-left {
float: left;
}
.float-right {
float: right;
}
.align-left {
text-align: left;
}
.align-right {
text-align: right;
}
/* additional classes */
.clear {
clear: both;
}
.hide {
display: none;
}
.gray {
color: #CCC;
}
.comments {
color: #333;
background: #FFF;
text-align: right;
border-top: 1px dashed #EFF0F1;
border-bottom: 1px dashed #EFF0F1;
padding: 5px 0;
margin-top: 20px;
}
html {
min-height: 100.1%;
}
/* ------ one ------------*/
body .mainText {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}
#demoText h1,.mainText h1 {
font-size: 130%;
color: #0099FF;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
margin: 5px 4px 5px 24px;
background: none;
padding: 0;
border: none;
text-transform: capitalize;
}
.mainText h2 {
font-size: 110%;
color: #000033;
font-family: Arial, Helvetica, sans-serif;
text-decoration: none;
background: none;
margin: 4px 32px 6px 22px;
text-transform: capitalize;
}
.mainText h3 {
font-size: 120%;
font-weight: 900;
margin: 14px 0 0 0;
text-align: center;
color: #000033;
}
.mainText table {
width: 95%;
border: 1px solid #0099FF;
border-collapse: collapse;
margin: 18px 7px;
}
.mainText table td {
background-color: #99CCFF;
color: #000033;
padding: 4px;
}
.mainText table th {
background-color: #000033;
color: #99CCFF;
padding: 4px;
}
.mainText .linkPar a {
color: #000033;
text-decoration: underline;
}
.mainText .linkPar a:hover {
color: #660033;
text-decoration: none;
font-weight: 900;
}
.pusher {
cursor: pointer;
padding: 3px 10px 3px 22px;
font-weight: 900;
font-size: 14px;
}
/* ------------- form specific styles are here -------------- */
fieldset {
margin: 0;
border: 1px solid #C3DE00;
padding: 10px;
/*border:none;
padding:0;*/
color: #7563A5;
}
legend {
background-color: #FFFFFF;
text-align: center;
color: #097981;
padding: 0 12px;
}
label {
text-align: right;
width: 298px;
border-right: 1px dotted #099;
padding-right: 5px;
margin: 0 0 8px 0;
float: left;
clear: left;
display: block;
color: #7563A5;
}
label.checkbox,label.textarea {
border: none;
}
label.lgfield {
border: none;
text-align: center;
clear: both;
float: none;
width: 100%;
}
fieldset input,fieldset select,fieldset textarea {
margin-left: 10px;
margin-bottom: 8px;
}
select.longfield {
margin: 0 0 0 115px;
}
input [type="radio"],input [type="checkbox"] {
margin: 2px 0 0 4px;
}
textarea {
width: 250px;
float: left;
}
/*Get Help Form Styles*/
p.formDisclaimer {
text-align: center;
margin: 32px 24px 12px 0;
font-style: italic;
}
div.buttonWrapper {
margin: 28px 0 14px 0;
clear: both;
text-align: center;
}
.formspacer {
height: 1em;
clear: both;
}
.hideField {
display: none;
}
.pushOpen {
height: 18em;
}
/* ----- error message for field validation ----- */
#stepForm label.warning {
text-align: left;
width: auto;
padding: 0;
margin: 0 0 0 10px;
float: none;
clear: none;
display: inline;
color: #CC3366;
font-size: 10px;
border: none;
border-top: 1px dotted #CC3366;
}
div.requiredNotice {
width: 140px;
float: right;
margin: 0 24px 0 0;
padding: 0;
}
h3.stepHeader {
text-align: left;
font-size: 16px;
font-weight: bold;
margin: 0 0 24px 24px;
color: #676cac;
}
ul#stepForm,ul#stepForm li {
margin: 0;
padding: 0;
}
ul#stepForm li {
list-style: none;
}
/* Form Buttons */
input.submitbutton,.nextbutton,.prevbutton {
width: 100px;
height: 40px;
background-color: #663399;
padding: 4px;
border: 1px solid #339933;
cursor: pointer;
text-align: center;
color: #FFFFFF;
margin: 7px;
}
input.submitbutton {
background-color: #006699;
}

View File

@@ -0,0 +1,146 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Test for jQuery validate() plugin</title>
<link rel="stylesheet" media="screen" href="css/screen.css">
<script src="../lib/jquery.js"></script>
<script src="../dist/jquery.validate.js"></script>
<script>
// only for demo purposes
$.validator.setDefaults({
submitHandler: function() {
alert("submitted!");
}
});
$(document).ready(function() {
$("#form1").validate();
$("#selecttest").validate();
});
</script>
<style>
.block { display: block; }
form.cmxform label.error { display: none; }
</style>
</head>
<body>
<h1 id="banner"><a href="http://bassistance.de/jquery-plugins/jquery-plugin-validation/">jQuery Validation Plugin</a> Demo</h1>
<div id="main">
<form class="cmxform" id="form1" method="get" action="">
<fieldset>
<legend>Validating a form with a radio and checkbox buttons</legend>
<fieldset>
<legend>Gender</legend>
<label for="gender_male">
<input type="radio" id="gender_male" value="m" name="gender" required>
Male
</label>
<label for="gender_female">
<input type="radio" id="gender_female" value="f" name="gender">
Female
</label>
<label for="gender" class="error">Please select your gender</label>
</fieldset>
<fieldset>
<legend>Family</legend>
<label for="family_single">
<input type="radio" id="family_single" value="s" name="family" required>
Single
</label>
<label for="family_married">
<input type="radio" id="family_married" value="m" name="family">
Married
</label>
<label for="family_other">
<input type="radio" id="family_other" value="o" name="family">
Other
</label>
<label for="family" class="error">Please select your family status.</label>
</fieldset>
<p>
<label for="agree">Please agree to our policy</label>
<input type="checkbox" class="checkbox" id="agree" name="agree" required>
<br>
<label for="agree" class="error block">Please agree to our policy!</label>
</p>
<fieldset>
<legend>Spam</legend>
<label for="spam_email">
<input type="checkbox" class="checkbox" id="spam_email" value="email" name="spam[]" required minlength="2">
Spam via E-Mail
</label>
<label for="spam_phone">
<input type="checkbox" class="checkbox" id="spam_phone" value="phone" name="spam[]">
Spam via Phone
</label>
<label for="spam_mail">
<input type="checkbox" class="checkbox" id="spam_mail" value="mail" name="spam[]">
Spam via Mail
</label>
<label for="spam[]" class="error">Please select at least two types of spam.</label>
</fieldset>
<p>
<input class="submit" type="submit" value="Submit">
</p>
</fieldset>
</form>
<form id="selecttest">
<h2>Some tests with selects</h2>
<p>
<label for="jungle">Please select a jungle noun</label><br>
<select id="jungle" name="jungle" title="Please select something!" required>
<option value=""></option>
<option value="1">Buga</option>
<option value="2">Baga</option>
<option value="3">Oi</option>
</select>
</p>
<p>
<label for="fruit">Please select at least two fruits</label><br>
<select id="fruit" name="fruit" title="Please select at least two fruits" required minlength="2" multiple="multiple">
<option value="b">Banana</option>
<option value="a">Apple</option>
<option value="p">Peach</option>
<option value="t">Turtle</option>
</select>
</p>
<p>
<label for="vegetables">Please select no more than two vergetables</label><br>
<select id="vegetables" name="vegetables" title="Please select no more than two vergetables" required maxlength="2" multiple="multiple">
<option value="p">Potato</option>
<option value="t">Tomato</option>
<option value="s">Salad</option>
</select>
</p>
<p>
<label for="cars">Please select at least two cars, but no more than three</label><br>
<select id="cars" name="cars" title="Please select at least two cars, but no more than three" required rangelength="[2,3]" multiple="multiple">
<option value="m_sl">Mercedes SL</option>
<option value="o_c">Opel Corsa</option>
<option value="vw_p">VW Polo</option>
<option value="t_s">Titanic Skoda</option>
</select>
</p>
<p><input type="submit" value="Validate Selecttests"></p>
</form>
<a href="index.html">Back to main page</a>
</div>
</body>
</html>

View File

@@ -0,0 +1,16 @@
#field { margin-left: .5em; float: left; }
#field, label { float: left; font-family: Arial, Helvetica, sans-serif; font-size: small; }
br { clear: both; }
input { border: 1px solid black; margin-bottom: .5em; }
input.error { border: 1px solid red; }
label.error {
background: url('images/unchecked.gif') no-repeat;
padding-left: 16px;
margin-left: .3em;
}
label.valid {
background: url('images/checked.gif') no-repeat;
display: block;
width: 16px;
height: 16px;
}

View File

@@ -0,0 +1,229 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>jQuery validation plug-in - ThemeRolldered demo</title>
<link rel="stylesheet" type="text/css" media="screen" href="http://code.jquery.com/ui/jquery-ui-git.css" />
<style type="text/css">
body { font-size: 62.5%; }
label { display: inline-block; width: 100px; }
legend { padding: 0.5em; }
fieldset fieldset label { display: block; }
#commentForm { width: 500px; }
#commentForm label { width: 250px; }
#commentForm label.error, #commentForm button.submit { margin-left: 253px; }
#signupForm { width: 670px; }
#signupForm label.error {
margin-left: 10px;
width: auto;
display: inline;
}
#newsletter_topics label.error {
display: none;
margin-left: 103px;
}
</style>
</head>
<body>
<form class="cmxform" id="commentForm" method="get" action="">
<fieldset class="ui-widget ui-widget-content ui-corner-all">
<legend class="ui-widget ui-widget-header ui-corner-all">Please provide your name, email address (won't be published) and a comment</legend>
<p>
<label for="cname">Name (required, at least 2 characters)</label>
<input id="cname" name="name" class="ui-widget-content" minlength="2" required type="text" />
<p>
<label for="cemail">E-Mail (required)</label>
<input id="cemail" name="email" class="ui-widget-content" type="email" required />
</p>
<p>
<label for="curl">URL (optional)</label>
<input id="curl" name="url" class="ui-widget-content" value="" type="url" />
</p>
<p>
<label for="ccomment">Your comment (required)</label>
<textarea id="ccomment" name="comment" class="ui-widget-content" required></textarea>
</p>
<p>
<button class="submit" type="submit">Submit</button>
</p>
</fieldset>
</form>
<form class="cmxform" id="signupForm" method="get" action="">
<fieldset class="ui-widget ui-widget-content ui-corner-all">
<legend class="ui-widget ui-widget-header ui-corner-all">Validating a complete form</legend>
<p>
<label for="firstname">Firstname</label>
<input id="firstname" name="firstname" type="text" />
</p>
<p>
<label for="lastname">Lastname</label>
<input id="lastname" name="lastname" type="text" />
</p>
<p>
<label for="username">Username</label>
<input id="username" name="username" type="text" />
</p>
<p>
<label for="password">Password</label>
<input id="password" name="password" type="password" />
</p>
<p>
<label for="confirm_password">Confirm password</label>
<input id="confirm_password" name="confirm_password" type="password" />
</p>
<p>
<label for="email">Email</label>
<input id="email" name="email" type="email" />
</p>
<p>
<label for="agree">Please agree to our policy</label>
<input type="checkbox" class="checkbox" id="agree" name="agree" />
</p>
<p>
<label for="newsletter">I'd like to receive the newsletter</label>
<input type="checkbox" class="checkbox" id="newsletter" name="newsletter" />
</p>
<fieldset id="newsletter_topics" class="ui-widget-content ui-corner-all">
<legend class="ui-widget-header ui-corner-all">Topics (select at least two) - note: would be hidden when newsletter isn't selected, but is visible here for the demo</legend>
<label for="topic_marketflash">
<input type="checkbox" id="topic_marketflash" value="marketflash" name="topic" />
Marketflash
</label>
<label for="topic_fuzz">
<input type="checkbox" id="topic_fuzz" value="fuzz" name="topic" />
Latest fuzz
</label>
<label for="topic_digester">
<input type="checkbox" id="topic_digester" value="digester" name="topic" />
Mailing list digester
</label>
<label for="topic" class="error">Please select at least two topics you'd like to receive.</label>
</fieldset>
<p>
<button class="submit" type="submit">Submit</button>
</p>
</fieldset>
</form>
<script src="../lib/jquery-1.6.1.js" type="text/javascript"></script>
<script src="../dist/jquery.validate.js" type="text/javascript"></script>
<script src="http://code.jquery.com/ui/jquery-ui-git.js"></script>
<script type="text/javascript">
$.validator.setDefaults({
submitHandler: function() { alert("submitted!"); },
showErrors: function(map, list) {
// there's probably a way to simplify this
var focussed = document.activeElement;
if (focussed && $(focussed).is("input, textarea")) {
$(this.currentForm).tooltip("close", { currentTarget: focussed }, true)
}
this.currentElements.removeAttr("title").removeClass("ui-state-highlight");
$.each(list, function(index, error) {
$(error.element).attr("title", error.message).addClass("ui-state-highlight");
});
if (focussed && $(focussed).is("input, textarea")) {
$(this.currentForm).tooltip("open", { target: focussed });
}
}
});
(function() {
// use custom tooltip; disable animations for now to work around lack of refresh method on tooltip
$("#commentForm, #signupForm").tooltip({
show: false,
hide: false
});
// validate the comment form when it is submitted
$("#commentForm").validate();
// validate signup form on keyup and submit
$("#signupForm").validate({
rules: {
firstname: "required",
lastname: "required",
username: {
required: true,
minlength: 2
},
password: {
required: true,
minlength: 5
},
confirm_password: {
required: true,
minlength: 5,
equalTo: "#password"
},
email: {
required: true,
email: true
},
topic: {
required: "#newsletter:checked",
minlength: 2
},
agree: "required"
},
messages: {
firstname: "Please enter your firstname",
lastname: "Please enter your lastname",
username: {
required: "Please enter a username",
minlength: "Your username must consist of at least 2 characters"
},
password: {
required: "Please provide a password",
minlength: "Your password must be at least 5 characters long"
},
confirm_password: {
required: "Please provide a password",
minlength: "Your password must be at least 5 characters long",
equalTo: "Please enter the same password as above"
},
email: "Please enter a valid email address",
agree: "Please accept our policy"
}
});
// propose username by combining first- and lastname
$("#username").focus(function() {
var firstname = $("#firstname").val();
var lastname = $("#lastname").val();
if(firstname && lastname && !this.value) {
this.value = firstname + "." + lastname;
}
});
//code to hide topic selection, disable for demo
var newsletter = $("#newsletter");
// newsletter topics are optional, hide at first
var inital = newsletter.is(":checked");
var topics = $("#newsletter_topics")[inital ? "removeClass" : "addClass"]("gray");
var topicInputs = topics.find("input").attr("disabled", !inital);
// show when newsletter is checked
newsletter.click(function() {
topics[this.checked ? "removeClass" : "addClass"]("gray");
topicInputs.attr("disabled", !this.checked);
});
$("#signupForm input:not(:submit)").addClass("ui-widget-content");
$(":submit").button();
})();
</script>
<script src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
<script>
$.fn.themeswitcher && $('<div/>').css({
position: "absolute",
right: 10,
top: 10
}).appendTo(document.body).themeswitcher();
</script>
</body>
</html>

View File

@@ -0,0 +1,76 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery Validation plugin: integration with TinyMCE</title>
<script type="text/javascript" src="../../lib/jquery.js"></script>
<script type="text/javascript" src="../../dist/jquery.validate.js"></script>
<script type="text/javascript" src="tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
mode : "textareas",
theme : "simple",
// update validation status on change
onchange_callback: function(editor) {
tinyMCE.triggerSave();
$("#" + editor.id).valid();
}
});
$(function() {
var validator = $("#myform").submit(function() {
// update underlying textarea before submit validation
tinyMCE.triggerSave();
}).validate({
ignore: "",
rules: {
title: "required",
content: "required"
},
errorPlacement: function(label, element) {
// position error label after generated textarea
if (element.is("textarea")) {
label.insertAfter(element.next());
} else {
label.insertAfter(element)
}
}
});
validator.focusInvalid = function() {
// put focus on tinymce on submit validation
if( this.settings.focusInvalid ) {
try {
var toFocus = $(this.findLastActive() || this.errorList.length && this.errorList[0].element || []);
if (toFocus.is("textarea")) {
tinyMCE.get(toFocus.attr("id")).focus();
} else {
toFocus.filter(":visible").focus();
}
} catch(e) {
// ignore IE throwing errors when focusing hidden elements
}
}
}
})
</script>
<!-- /TinyMCE -->
</head>
<body>
<form id="myform" action="">
<h3>TinyMCE and Validation Plugin integration example</h3>
<label>Some other field</label>
<input name="title" />
<br/>
<label>Some richt text</label>
<textarea id="content" name="content" rows="15" cols="80" style="width: 80%"></textarea>
<br />
<input type="submit" name="save" value="Submit" />
</form>
</body>
</html>

View File

@@ -0,0 +1 @@
(function(){var DOM=tinymce.DOM;tinymce.ThemeManager.requireLangPack('simple');tinymce.create('tinymce.themes.SimpleTheme',{init:function(ed,url){var t=this,states=['Bold','Italic','Underline','Strikethrough','InsertUnorderedList','InsertOrderedList'],s=ed.settings;t.editor=ed;ed.onInit.add(function(){ed.onNodeChange.add(function(ed,cm){tinymce.each(states,function(c){cm.get(c.toLowerCase()).setActive(ed.queryCommandState(c));});});ed.dom.loadCSS(url+"/skins/"+s.skin+"/content.css");});DOM.loadCSS((s.editor_css?ed.documentBaseURI.toAbsolute(s.editor_css):'')||url+"/skins/"+s.skin+"/ui.css");},renderUI:function(o){var t=this,n=o.targetNode,ic,tb,ed=t.editor,cf=ed.controlManager,sc;n=DOM.insertAfter(DOM.create('span',{id:ed.id+'_container','class':'mceEditor '+ed.settings.skin+'SimpleSkin'}),n);n=sc=DOM.add(n,'table',{cellPadding:0,cellSpacing:0,'class':'mceLayout'});n=tb=DOM.add(n,'tbody');n=DOM.add(tb,'tr');n=ic=DOM.add(DOM.add(n,'td'),'div',{'class':'mceIframeContainer'});n=DOM.add(DOM.add(tb,'tr',{'class':'last'}),'td',{'class':'mceToolbar mceLast',align:'center'});tb=t.toolbar=cf.createToolbar("tools1");tb.add(cf.createButton('bold',{title:'simple.bold_desc',cmd:'Bold'}));tb.add(cf.createButton('italic',{title:'simple.italic_desc',cmd:'Italic'}));tb.add(cf.createButton('underline',{title:'simple.underline_desc',cmd:'Underline'}));tb.add(cf.createButton('strikethrough',{title:'simple.striketrough_desc',cmd:'Strikethrough'}));tb.add(cf.createSeparator());tb.add(cf.createButton('undo',{title:'simple.undo_desc',cmd:'Undo'}));tb.add(cf.createButton('redo',{title:'simple.redo_desc',cmd:'Redo'}));tb.add(cf.createSeparator());tb.add(cf.createButton('cleanup',{title:'simple.cleanup_desc',cmd:'mceCleanup'}));tb.add(cf.createSeparator());tb.add(cf.createButton('insertunorderedlist',{title:'simple.bullist_desc',cmd:'InsertUnorderedList'}));tb.add(cf.createButton('insertorderedlist',{title:'simple.numlist_desc',cmd:'InsertOrderedList'}));tb.renderTo(n);return{iframeContainer:ic,editorContainer:ed.id+'_container',sizeContainer:sc,deltaHeight:-20};},getInfo:function(){return{longname:'Simple theme',author:'Moxiecode Systems AB',authorurl:'http://tinymce.moxiecode.com',version:tinymce.majorVersion+"."+tinymce.minorVersion}}});tinymce.ThemeManager.add('simple',tinymce.themes.SimpleTheme);})();

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

View File

@@ -0,0 +1,11 @@
tinyMCE.addI18n('en.simple',{
bold_desc:"Bold (Ctrl+B)",
italic_desc:"Italic (Ctrl+I)",
underline_desc:"Underline (Ctrl+U)",
striketrough_desc:"Strikethrough",
bullist_desc:"Unordered list",
numlist_desc:"Ordered list",
undo_desc:"Undo (Ctrl+Z)",
redo_desc:"Redo (Ctrl+Y)",
cleanup_desc:"Cleanup messy code"
});

View File

@@ -0,0 +1,32 @@
/* Reset */
.defaultSimpleSkin table, .defaultSimpleSkin tbody, .defaultSimpleSkin a, .defaultSimpleSkin img, .defaultSimpleSkin tr, .defaultSimpleSkin div, .defaultSimpleSkin td, .defaultSimpleSkin iframe, .defaultSimpleSkin span, .defaultSimpleSkin * {border:0; margin:0; padding:0; background:transparent; white-space:nowrap; text-decoration:none; font-weight:normal; cursor:default; color:#000}
/* Containers */
.defaultSimpleSkin {position:relative}
.defaultSimpleSkin table.mceLayout {background:#F0F0EE; border:1px solid #CCC;}
.defaultSimpleSkin iframe {display:block; background:#FFF; border-bottom:1px solid #CCC;}
.defaultSimpleSkin .mceToolbar {height:24px;}
/* Layout */
.defaultSimpleSkin span.mceIcon, .defaultSimpleSkin img.mceIcon {display:block; width:20px; height:20px}
.defaultSimpleSkin .mceIcon {background:url(../../img/icons.gif) no-repeat 20px 20px}
/* Button */
.defaultSimpleSkin .mceButton {display:block; border:1px solid #F0F0EE; width:20px; height:20px}
.defaultSimpleSkin a.mceButtonEnabled:hover {border:1px solid #0A246A; background-color:#B2BBD0}
.defaultSimpleSkin a.mceButtonActive {border:1px solid #0A246A; background-color:#C2CBE0}
.defaultSimpleSkin .mceButtonDisabled span {opacity:0.3; -ms-filter:'alpha(opacity=30)'; filter:alpha(opacity=30)}
/* Separator */
.defaultSimpleSkin .mceSeparator {display:block; background:url(../../img/icons.gif) -180px 0; width:2px; height:20px; margin:0 2px 0 4px}
/* Theme */
.defaultSimpleSkin span.mce_bold {background-position:0 0}
.defaultSimpleSkin span.mce_italic {background-position:-60px 0}
.defaultSimpleSkin span.mce_underline {background-position:-140px 0}
.defaultSimpleSkin span.mce_strikethrough {background-position:-120px 0}
.defaultSimpleSkin span.mce_undo {background-position:-160px 0}
.defaultSimpleSkin span.mce_redo {background-position:-100px 0}
.defaultSimpleSkin span.mce_cleanup {background-position:-40px 0}
.defaultSimpleSkin span.mce_insertunorderedlist {background-position:-20px 0}
.defaultSimpleSkin span.mce_insertorderedlist {background-position:-80px 0}

File diff suppressed because one or more lines are too long

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,27 @@
(function() {
var parts = document.location.search.slice( 1 ).split( "&" ),
length = parts.length,
scripts = document.getElementsByTagName("script"),
src = scripts[ scripts.length - 1].src,
i = 0,
current,
version = "1.9.1",
file = "http://code.jquery.com/jquery-git.js";
for ( ; i < length; i++ ) {
current = parts[ i ].split( "=" );
if ( current[ 0 ] === "jquery" ) {
version = current[ 1 ];
break;
}
}
if (version != "git") {
file = src.replace(/jquery\.js$/, "jquery-" + version + ".js");
}
document.write( "<script src='" + file + "'></script>" );
})();

View File

@@ -0,0 +1,382 @@
/*!
* MockJax - jQuery Plugin to Mock Ajax requests
*
* Version: 1.4.0
* Released: 2011-02-04
* Source: http://github.com/appendto/jquery-mockjax
* Docs: http://enterprisejquery.com/2010/07/mock-your-ajax-requests-with-mockjax-for-rapid-development
* Plugin: mockjax
* Author: Jonathan Sharp (http://jdsharp.com)
* License: MIT,GPL
*
* Copyright (c) 2010 appendTo LLC.
* Dual licensed under the MIT or GPL licenses.
* http://appendto.com/open-source-licenses
*/
(function($) {
var _ajax = $.ajax,
mockHandlers = [];
function parseXML(xml) {
if ( window['DOMParser'] == undefined && window.ActiveXObject ) {
DOMParser = function() { };
DOMParser.prototype.parseFromString = function( xmlString ) {
var doc = new ActiveXObject('Microsoft.XMLDOM');
doc.async = 'false';
doc.loadXML( xmlString );
return doc;
};
}
try {
var xmlDoc = ( new DOMParser() ).parseFromString( xml, 'text/xml' );
if ( $.isXMLDoc( xmlDoc ) ) {
var err = $('parsererror', xmlDoc);
if ( err.length == 1 ) {
throw('Error: ' + $(xmlDoc).text() );
}
} else {
throw('Unable to parse XML');
}
} catch( e ) {
var msg = ( e.name == undefined ? e : e.name + ': ' + e.message );
$(document).trigger('xmlParseError', [ msg ]);
return undefined;
}
return xmlDoc;
}
$.extend({
ajax: function(origSettings) {
var s = jQuery.extend(true, {}, jQuery.ajaxSettings, origSettings),
mock = false;
// Iterate over our mock handlers (in registration order) until we find
// one that is willing to intercept the request
$.each(mockHandlers, function(k, v) {
if ( !mockHandlers[k] ) {
return;
}
var m = null;
// If the mock was registered with a function, let the function decide if we
// want to mock this request
if ( $.isFunction(mockHandlers[k]) ) {
m = mockHandlers[k](s);
} else {
m = mockHandlers[k];
// Inspect the URL of the request and check if the mock handler's url
// matches the url for this ajax request
if ( $.isFunction(m.url.test) ) {
// The user provided a regex for the url, test it
if ( !m.url.test( s.url ) ) {
m = null;
}
} else {
// Look for a simple wildcard '*' or a direct URL match
var star = m.url.indexOf('*');
if ( ( m.url != '*' && m.url != s.url && star == -1 ) ||
( star > -1 && m.url.substr(0, star) != s.url.substr(0, star) ) ) {
// The url we tested did not match the wildcard *
m = null;
}
}
if ( m ) {
// Inspect the data submitted in the request (either POST body or GET query string)
if ( m.data && s.data ) {
var identical = false;
// Deep inspect the identity of the objects
(function ident(mock, live) {
// Test for situations where the data is a querystring (not an object)
if (typeof live === 'string') {
// Querystring may be a regex
identical = $.isFunction( mock.test ) ? mock.test(live) : mock == live;
return identical;
}
$.each(mock, function(k, v) {
if ( live[k] === undefined ) {
identical = false;
return false;
} else {
identical = true;
if ( typeof live[k] == 'object' ) {
return ident(mock[k], live[k]);
} else {
if ( $.isFunction( mock[k].test ) ) {
identical = mock[k].test(live[k]);
} else {
identical = ( mock[k] == live[k] );
}
return identical;
}
}
});
})(m.data, s.data);
// They're not identical, do not mock this request
if ( identical == false ) {
m = null;
}
}
// Inspect the request type
if ( m && m.type && m.type != s.type ) {
// The request type doesn't match (GET vs. POST)
m = null;
}
}
}
if ( m ) {
mock = true;
// Handle console logging
var c = $.extend({}, $.mockjaxSettings, m);
if ( c.log && $.isFunction(c.log) ) {
c.log('MOCK ' + s.type.toUpperCase() + ': ' + s.url, $.extend({}, s));
}
var jsre = /=\?(&|$)/, jsc = (new Date()).getTime();
// Handle JSONP Parameter Callbacks, we need to replicate some of the jQuery core here
// because there isn't an easy hook for the cross domain script tag of jsonp
if ( s.dataType === "jsonp" ) {
if ( s.type.toUpperCase() === "GET" ) {
if ( !jsre.test( s.url ) ) {
s.url += (rquery.test( s.url ) ? "&" : "?") + (s.jsonp || "callback") + "=?";
}
} else if ( !s.data || !jsre.test(s.data) ) {
s.data = (s.data ? s.data + "&" : "") + (s.jsonp || "callback") + "=?";
}
s.dataType = "json";
}
// Build temporary JSONP function
if ( s.dataType === "json" && (s.data && jsre.test(s.data) || jsre.test(s.url)) ) {
jsonp = s.jsonpCallback || ("jsonp" + jsc++);
// Replace the =? sequence both in the query string and the data
if ( s.data ) {
s.data = (s.data + "").replace(jsre, "=" + jsonp + "$1");
}
s.url = s.url.replace(jsre, "=" + jsonp + "$1");
// We need to make sure
// that a JSONP style response is executed properly
s.dataType = "script";
// Handle JSONP-style loading
window[ jsonp ] = window[ jsonp ] || function( tmp ) {
data = tmp;
success();
complete();
// Garbage collect
window[ jsonp ] = undefined;
try {
delete window[ jsonp ];
} catch(e) {}
if ( head ) {
head.removeChild( script );
}
};
}
var rurl = /^(\w+:)?\/\/([^\/?#]+)/,
parts = rurl.exec( s.url ),
remote = parts && (parts[1] && parts[1] !== location.protocol || parts[2] !== location.host);
// Test if we are going to create a script tag (if so, intercept & mock)
if ( s.dataType === "script" && s.type.toUpperCase() === "GET" && remote ) {
// Synthesize the mock request for adding a script tag
var callbackContext = origSettings && origSettings.context || s;
function success() {
// If a local callback was specified, fire it and pass it the data
if ( s.success ) {
s.success.call( callbackContext, ( m.response ? m.response.toString() : m.responseText || ''), status, {} );
}
// Fire the global callback
if ( s.global ) {
trigger( "ajaxSuccess", [{}, s] );
}
}
function complete() {
// Process result
if ( s.complete ) {
s.complete.call( callbackContext, {} , status );
}
// The request was completed
if ( s.global ) {
trigger( "ajaxComplete", [{}, s] );
}
// Handle the global AJAX counter
if ( s.global && ! --jQuery.active ) {
jQuery.event.trigger( "ajaxStop" );
}
}
function trigger(type, args) {
(s.context ? jQuery(s.context) : jQuery.event).trigger(type, args);
}
if ( m.response && $.isFunction(m.response) ) {
m.response(origSettings);
} else {
$.globalEval(m.responseText);
}
success();
complete();
return false;
}
mock = _ajax.call($, $.extend(true, {}, origSettings, {
// Mock the XHR object
xhr: function() {
// Extend with our default mockjax settings
m = $.extend({}, $.mockjaxSettings, m);
if ( m.contentType ) {
m.headers['content-type'] = m.contentType;
}
// Return our mock xhr object
return {
status: m.status,
readyState: 1,
open: function() { },
send: function() {
// This is a substitute for < 1.4 which lacks $.proxy
var process = (function(that) {
return function() {
return (function() {
// The request has returned
this.status = m.status;
this.readyState = 4;
// We have an executable function, call it to give
// the mock handler a chance to update it's data
if ( $.isFunction(m.response) ) {
m.response(origSettings);
}
// Copy over our mock to our xhr object before passing control back to
// jQuery's onreadystatechange callback
if ( s.dataType == 'json' && ( typeof m.responseText == 'object' ) ) {
this.responseText = JSON.stringify(m.responseText);
} else if ( s.dataType == 'xml' ) {
if ( typeof m.responseXML == 'string' ) {
this.responseXML = parseXML(m.responseXML);
} else {
this.responseXML = m.responseXML;
}
} else {
this.responseText = m.responseText;
}
// jQuery < 1.4 doesn't have onreadystate change for xhr
if ( $.isFunction(this.onreadystatechange) ) {
this.onreadystatechange( m.isTimeout ? 'timeout' : undefined );
}
}).apply(that);
};
})(this);
if ( m.proxy ) {
// We're proxying this request and loading in an external file instead
_ajax({
global: false,
url: m.proxy,
type: m.proxyType,
data: m.data,
dataType: s.dataType,
complete: function(xhr, txt) {
m.responseXML = xhr.responseXML;
m.responseText = xhr.responseText;
this.responseTimer = setTimeout(process, m.responseTime || 0);
}
});
} else {
// type == 'POST' || 'GET' || 'DELETE'
if ( s.async === false ) {
// TODO: Blocking delay
process();
} else {
this.responseTimer = setTimeout(process, m.responseTime || 50);
}
}
},
abort: function() {
clearTimeout(this.responseTimer);
},
setRequestHeader: function() { },
getResponseHeader: function(header) {
// 'Last-modified', 'Etag', 'content-type' are all checked by jQuery
if ( m.headers && m.headers[header] ) {
// Return arbitrary headers
return m.headers[header];
} else if ( header.toLowerCase() == 'last-modified' ) {
return m.lastModified || (new Date()).toString();
} else if ( header.toLowerCase() == 'etag' ) {
return m.etag || '';
} else if ( header.toLowerCase() == 'content-type' ) {
return m.contentType || 'text/plain';
}
},
getAllResponseHeaders: function() {
var headers = '';
$.each(m.headers, function(k, v) {
headers += k + ': ' + v + "\n";
});
return headers;
}
};
}
}));
return false;
}
});
// We don't have a mock request, trigger a normal request
if ( !mock ) {
return _ajax.apply($, arguments);
} else {
return mock;
}
}
});
$.mockjaxSettings = {
//url: null,
//type: 'GET',
log: function(msg) {
window['console'] && window.console.log && window.console.log(msg);
},
status: 200,
responseTime: 500,
isTimeout: false,
contentType: 'text/plain',
response: '',
responseText: '',
responseXML: '',
proxy: '',
proxyType: 'GET',
lastModified: null,
etag: '',
headers: {
etag: 'IJF@H#@923uf8023hFO@I#H#',
'content-type' : 'text/plain'
}
};
$.mockjax = function(settings) {
var i = mockHandlers.length;
mockHandlers[i] = settings;
return i;
};
$.mockjaxClear = function(i) {
if ( arguments.length == 1 ) {
mockHandlers[i] = null;
} else {
mockHandlers = [];
}
};
})(jQuery);

View File

@@ -0,0 +1,25 @@
/*
* Translated default messages for the jQuery validation plugin.
* Locale: AR (Arabic; العربية)
*/
(function($) {
$.extend($.validator.messages, {
required: "هذا الحقل إلزامي",
remote: "يرجى تصحيح هذا الحقل للمتابعة",
email: "رجاء إدخال عنوان بريد إلكتروني صحيح",
url: "رجاء إدخال عنوان موقع إلكتروني صحيح",
date: "رجاء إدخال تاريخ صحيح",
dateISO: "رجاء إدخال تاريخ صحيح (ISO)",
number: "رجاء إدخال عدد بطريقة صحيحة",
digits: "رجاء إدخال أرقام فقط",
creditcard: "رجاء إدخال رقم بطاقة ائتمان صحيح",
equalTo: "رجاء إدخال نفس القيمة",
extension: "رجاء إدخال ملف بامتداد موافق عليه",
maxlength: $.validator.format("الحد الأقصى لعدد الحروف هو {0}"),
minlength: $.validator.format("الحد الأدنى لعدد الحروف هو {0}"),
rangelength: $.validator.format("عدد الحروف يجب أن يكون بين {0} و {1}"),
range: $.validator.format("رجاء إدخال عدد قيمته بين {0} و {1}"),
max: $.validator.format("رجاء إدخال عدد أقل من أو يساوي (0}"),
min: $.validator.format("رجاء إدخال عدد أكبر من أو يساوي (0}")
});
}(jQuery));

View File

@@ -0,0 +1,25 @@
/*
* Translated default messages for the jQuery validation plugin.
* Locale: BG (Bulgarian; български език)
*/
(function($) {
$.extend($.validator.messages, {
required: "Полето е задължително.",
remote: "Моля, въведете правилната стойност.",
email: "Моля, въведете валиден email.",
url: "Моля, въведете валидно URL.",
date: "Моля, въведете валидна дата.",
dateISO: "Моля, въведете валидна дата (ISO).",
number: "Моля, въведете валиден номер.",
digits: "Моля, въведете само цифри.",
creditcard: "Моля, въведете валиден номер на кредитна карта.",
equalTo: "Моля, въведете същата стойност отново.",
extension: "Моля, въведете стойност с валидно разширение.",
maxlength: $.validator.format("Моля, въведете повече от {0} символа."),
minlength: $.validator.format("Моля, въведете поне {0} символа."),
rangelength: $.validator.format("Моля, въведете стойност с дължина между {0} и {1} символа."),
range: $.validator.format("Моля, въведете стойност между {0} и {1}."),
max: $.validator.format("Моля, въведете стойност по-малка или равна на {0}."),
min: $.validator.format("Моля, въведете стойност по-голяма или равна на {0}.")
});
}(jQuery));

View File

@@ -0,0 +1,25 @@
/*
* Translated default messages for the jQuery validation plugin.
* Locale: CA (Catalan; català)
*/
(function($) {
$.extend($.validator.messages, {
required: "Aquest camp és obligatori.",
remote: "Si us plau, omple aquest camp.",
email: "Si us plau, escriu una adreça de correu-e vàlida",
url: "Si us plau, escriu una URL vàlida.",
date: "Si us plau, escriu una data vàlida.",
dateISO: "Si us plau, escriu una data (ISO) vàlida.",
number: "Si us plau, escriu un número enter vàlid.",
digits: "Si us plau, escriu només dígits.",
creditcard: "Si us plau, escriu un número de tarjeta vàlid.",
equalTo: "Si us plau, escriu el maateix valor de nou.",
extension: "Si us plau, escriu un valor amb una extensió acceptada.",
maxlength: $.validator.format("Si us plau, no escriguis més de {0} caracters."),
minlength: $.validator.format("Si us plau, no escriguis menys de {0} caracters."),
rangelength: $.validator.format("Si us plau, escriu un valor entre {0} i {1} caracters."),
range: $.validator.format("Si us plau, escriu un valor entre {0} i {1}."),
max: $.validator.format("Si us plau, escriu un valor menor o igual a {0}."),
min: $.validator.format("Si us plau, escriu un valor major o igual a {0}.")
});
}(jQuery));

View File

@@ -0,0 +1,25 @@
/*
* Translated default messages for the jQuery validation plugin.
* Locale: CS (Czech; čeština, český jazyk)
*/
(function($) {
$.extend($.validator.messages, {
required: "Tento údaj je povinný.",
remote: "Prosím, opravte tento údaj.",
email: "Prosím, zadejte platný e-mail.",
url: "Prosím, zadejte platné URL.",
date: "Prosím, zadejte platné datum.",
dateISO: "Prosím, zadejte platné datum (ISO).",
number: "Prosím, zadejte číslo.",
digits: "Prosím, zadávejte pouze číslice.",
creditcard: "Prosím, zadejte číslo kreditní karty.",
equalTo: "Prosím, zadejte znovu stejnou hodnotu.",
extension: "Prosím, zadejte soubor se správnou příponou.",
maxlength: $.validator.format("Prosím, zadejte nejvíce {0} znaků."),
minlength: $.validator.format("Prosím, zadejte nejméně {0} znaků."),
rangelength: $.validator.format("Prosím, zadejte od {0} do {1} znaků."),
range: $.validator.format("Prosím, zadejte hodnotu od {0} do {1}."),
max: $.validator.format("Prosím, zadejte hodnotu menší nebo rovnu {0}."),
min: $.validator.format("Prosím, zadejte hodnotu větší nebo rovnu {0}.")
});
}(jQuery));

View File

@@ -0,0 +1,22 @@
/*
* Translated default messages for the jQuery validation plugin.
* Locale: DA (Danish; dansk)
*/
(function($) {
$.extend($.validator.messages, {
required: "Dette felt er påkrævet.",
maxlength: $.validator.format("Indtast højst {0} tegn."),
minlength: $.validator.format("Indtast mindst {0} tegn."),
rangelength: $.validator.format("Indtast mindst {0} og højst {1} tegn."),
email: "Indtast en gyldig email-adresse.",
url: "Indtast en gyldig URL.",
date: "Indtast en gyldig dato.",
number: "Indtast et tal.",
digits: "Indtast kun cifre.",
equalTo: "Indtast den samme værdi igen.",
range: $.validator.format("Angiv en værdi mellem {0} og {1}."),
max: $.validator.format("Angiv en værdi der højst er {0}."),
min: $.validator.format("Angiv en værdi der mindst er {0}."),
creditcard: "Indtast et gyldigt kreditkortnummer."
});
}(jQuery));

View File

@@ -0,0 +1,22 @@
/*
* Translated default messages for the jQuery validation plugin.
* Locale: DE (German, Deutsch)
*/
(function($) {
$.extend($.validator.messages, {
required: "Dieses Feld ist ein Pflichtfeld.",
maxlength: $.validator.format("Geben Sie bitte maximal {0} Zeichen ein."),
minlength: $.validator.format("Geben Sie bitte mindestens {0} Zeichen ein."),
rangelength: $.validator.format("Geben Sie bitte mindestens {0} und maximal {1} Zeichen ein."),
email: "Geben Sie bitte eine gültige E-Mail Adresse ein.",
url: "Geben Sie bitte eine gültige URL ein.",
date: "Bitte geben Sie ein gültiges Datum ein.",
number: "Geben Sie bitte eine Nummer ein.",
digits: "Geben Sie bitte nur Ziffern ein.",
equalTo: "Bitte denselben Wert wiederholen.",
range: $.validator.format("Geben Sie bitte einen Wert zwischen {0} und {1} ein."),
max: $.validator.format("Geben Sie bitte einen Wert kleiner oder gleich {0} ein."),
min: $.validator.format("Geben Sie bitte einen Wert größer oder gleich {0} ein."),
creditcard: "Geben Sie bitte eine gültige Kreditkarten-Nummer ein."
});
}(jQuery));

View File

@@ -0,0 +1,25 @@
/*
* Translated default messages for the jQuery validation plugin.
* Locale: EL (Greek; ελληνικά)
*/
(function($) {
$.extend($.validator.messages, {
required: "Αυτό το πεδίο είναι υποχρεωτικό.",
remote: "Παρακαλώ διορθώστε αυτό το πεδίο.",
email: "Παρακαλώ εισάγετε μια έγκυρη διεύθυνση email.",
url: "Παρακαλώ εισάγετε ένα έγκυρο URL.",
date: "Παρακαλώ εισάγετε μια έγκυρη ημερομηνία.",
dateISO: "Παρακαλώ εισάγετε μια έγκυρη ημερομηνία (ISO).",
number: "Παρακαλώ εισάγετε έναν έγκυρο αριθμό.",
digits: "Παρακαλώ εισάγετε μόνο αριθμητικά ψηφία.",
creditcard: "Παρακαλώ εισάγετε έναν έγκυρο αριθμό πιστωτικής κάρτας.",
equalTo: "Παρακαλώ εισάγετε την ίδια τιμή ξανά.",
extension: "Παρακαλώ εισάγετε μια τιμή με έγκυρη επέκταση αρχείου.",
maxlength: $.validator.format("Παρακαλώ εισάγετε μέχρι και {0} χαρακτήρες."),
minlength: $.validator.format("Παρακαλώ εισάγετε τουλάχιστον {0} χαρακτήρες."),
rangelength: $.validator.format("Παρακαλώ εισάγετε μια τιμή με μήκος μεταξύ {0} και {1} χαρακτήρων."),
range: $.validator.format("Παρακαλώ εισάγετε μια τιμή μεταξύ {0} και {1}."),
max: $.validator.format("Παρακαλώ εισάγετε μια τιμή μικρότερη ή ίση του {0}."),
min: $.validator.format("Παρακαλώ εισάγετε μια τιμή μεγαλύτερη ή ίση του {0}.")
});
}(jQuery));

View File

@@ -0,0 +1,28 @@
/*
* Translated default messages for the jQuery validation plugin.
* Locale: ES (Spanish; Español)
*/
(function($) {
$.extend($.validator.messages, {
required: "Este campo es obligatorio.",
remote: "Por favor, rellena este campo.",
email: "Por favor, escribe una dirección de correo válida.",
url: "Por favor, escribe una URL válida.",
date: "Por favor, escribe una fecha válida.",
dateISO: "Por favor, escribe una fecha (ISO) válida.",
number: "Por favor, escribe un número entero válido.",
digits: "Por favor, escribe sólo dígitos.",
creditcard: "Por favor, escribe un número de tarjeta válido.",
equalTo: "Por favor, escribe el mismo valor de nuevo.",
extension: "Por favor, escribe un valor con una extensión aceptada.",
maxlength: $.validator.format("Por favor, no escribas más de {0} caracteres."),
minlength: $.validator.format("Por favor, no escribas menos de {0} caracteres."),
rangelength: $.validator.format("Por favor, escribe un valor entre {0} y {1} caracteres."),
range: $.validator.format("Por favor, escribe un valor entre {0} y {1}."),
max: $.validator.format("Por favor, escribe un valor menor o igual a {0}."),
min: $.validator.format("Por favor, escribe un valor mayor o igual a {0}."),
nifES: "Por favor, escribe un NIF válido.",
nieES: "Por favor, escribe un NIE válido.",
cifES: "Por favor, escribe un CIF válido."
});
}(jQuery));

View File

@@ -0,0 +1,29 @@
/*
* Translated default messages for the jQuery validation plugin.
* Locale: ES (Spanish; Español)
* Region: AR (Argentina)
*/
(function($) {
$.extend($.validator.messages, {
required: "Este campo es obligatorio.",
remote: "Por favor, completá este campo.",
email: "Por favor, escribí una dirección de correo válida.",
url: "Por favor, escribí una URL válida.",
date: "Por favor, escribí una fecha válida.",
dateISO: "Por favor, escribí una fecha (ISO) válida.",
number: "Por favor, escribí un número entero válido.",
digits: "Por favor, escribí sólo dígitos.",
creditcard: "Por favor, escribí un número de tarjeta válido.",
equalTo: "Por favor, escribí el mismo valor de nuevo.",
extension: "Por favor, escribí un valor con una extensión aceptada.",
maxlength: $.validator.format("Por favor, no escribas más de {0} caracteres."),
minlength: $.validator.format("Por favor, no escribas menos de {0} caracteres."),
rangelength: $.validator.format("Por favor, escribí un valor entre {0} y {1} caracteres."),
range: $.validator.format("Por favor, escribí un valor entre {0} y {1}."),
max: $.validator.format("Por favor, escribí un valor menor o igual a {0}."),
min: $.validator.format("Por favor, escribí un valor mayor o igual a {0}."),
nifES: "Por favor, escribí un NIF válido.",
nieES: "Por favor, escribí un NIE válido.",
cifES: "Por favor, escribí un CIF válido."
});
}(jQuery));

View File

@@ -0,0 +1,23 @@
/*
* Translated default messages for the jQuery validation plugin.
* Locale: ET (Estonian; eesti, eesti keel)
*/
(function($) {
$.extend($.validator.messages, {
required: "See väli peab olema täidetud.",
maxlength: $.validator.format("Palun sisestage vähem kui {0} tähemärki."),
minlength: $.validator.format("Palun sisestage vähemalt {0} tähemärki."),
rangelength: $.validator.format("Palun sisestage väärtus vahemikus {0} kuni {1} tähemärki."),
email: "Palun sisestage korrektne e-maili aadress.",
url: "Palun sisestage korrektne URL.",
date: "Palun sisestage korrektne kuupäev.",
dateISO: "Palun sisestage korrektne kuupäev (YYYY-MM-DD).",
number: "Palun sisestage korrektne number.",
digits: "Palun sisestage ainult numbreid.",
equalTo: "Palun sisestage sama väärtus uuesti.",
range: $.validator.format("Palun sisestage väärtus vahemikus {0} kuni {1}."),
max: $.validator.format("Palun sisestage väärtus, mis on väiksem või võrdne arvuga {0}."),
min: $.validator.format("Palun sisestage väärtus, mis on suurem või võrdne arvuga {0}."),
creditcard: "Palun sisestage korrektne krediitkaardi number."
});
}(jQuery));

View File

@@ -0,0 +1,25 @@
/*
* Translated default messages for the jQuery validation plugin.
* Locale: EU (Basque; euskara, euskera)
*/
(function($) {
$.extend($.validator.messages, {
required: "Eremu hau beharrezkoa da.",
remote: "Mesedez, bete eremu hau.",
email: "Mesedez, idatzi baliozko posta helbide bat.",
url: "Mesedez, idatzi baliozko URL bat.",
date: "Mesedez, idatzi baliozko data bat.",
dateISO: "Mesedez, idatzi baliozko (ISO) data bat.",
number: "Mesedez, idatzi baliozko zenbaki oso bat.",
digits: "Mesedez, idatzi digituak soilik.",
creditcard: "Mesedez, idatzi baliozko txartel zenbaki bat.",
equalTo: "Mesedez, idatzi berdina berriro ere.",
extension: "Mesedez, idatzi onartutako luzapena duen balio bat.",
maxlength: $.validator.format("Mesedez, ez idatzi {0} karaktere baino gehiago."),
minlength: $.validator.format("Mesedez, ez idatzi {0} karaktere baino gutxiago."),
rangelength: $.validator.format("Mesedez, idatzi {0} eta {1} karaktere arteko balio bat."),
range: $.validator.format("Mesedez, idatzi {0} eta {1} arteko balio bat."),
max: $.validator.format("Mesedez, idatzi {0} edo txikiagoa den balio bat."),
min: $.validator.format("Mesedez, idatzi {0} edo handiagoa den balio bat.")
});
}(jQuery));

View File

@@ -0,0 +1,25 @@
/*
* Translated default messages for the jQuery validation plugin.
* Locale: FA (Persian; فارسی)
*/
(function($) {
$.extend($.validator.messages, {
required: "تکمیل این فیلد اجباری است.",
remote: "لطفا این فیلد را تصحیح کنید.",
email: ".لطفا یک ایمیل صحیح وارد کنید",
url: "لطفا آدرس صحیح وارد کنید.",
date: "لطفا یک تاریخ صحیح وارد کنید",
dateISO: "لطفا تاریخ صحیح وارد کنید (ISO).",
number: "لطفا عدد صحیح وارد کنید.",
digits: "لطفا تنها رقم وارد کنید",
creditcard: "لطفا کریدیت کارت صحیح وارد کنید.",
equalTo: "لطفا مقدار برابری وارد کنید",
extension: "لطفا مقداری وارد کنید که ",
maxlength: $.validator.format("لطفا بیشتر از {0} حرف وارد نکنید."),
minlength: $.validator.format("لطفا کمتر از {0} حرف وارد نکنید."),
rangelength: $.validator.format("لطفا مقداری بین {0} تا {1} حرف وارد کنید."),
range: $.validator.format("لطفا مقداری بین {0} تا {1} حرف وارد کنید."),
max: $.validator.format("لطفا مقداری کمتر از {0} حرف وارد کنید."),
min: $.validator.format("لطفا مقداری بیشتر از {0} حرف وارد کنید.")
});
}(jQuery));

View File

@@ -0,0 +1,23 @@
/*
* Translated default messages for the jQuery validation plugin.
* Locale: FI (Finnish; suomi, suomen kieli)
*/
(function($) {
$.extend($.validator.messages, {
required: "T&auml;m&auml; kentt&auml; on pakollinen.",
email: "Sy&ouml;t&auml; oikea s&auml;hk&ouml;postiosoite.",
url: "Sy&ouml;t&auml; oikea URL osoite.",
date: "Sy&ouml;t&auml; oike p&auml;iv&auml;m&auml;&auml;r&auml;.",
dateISO: "Sy&ouml;t&auml; oike p&auml;iv&auml;m&auml;&auml;r&auml; (VVVV-MM-DD).",
number: "Sy&ouml;t&auml; numero.",
creditcard: "Sy&ouml;t&auml; voimassa oleva luottokorttinumero.",
digits: "Sy&ouml;t&auml; pelk&auml;st&auml;&auml;n numeroita.",
equalTo: "Sy&ouml;t&auml; sama arvo uudestaan.",
maxlength: $.validator.format("Voit sy&ouml;tt&auml;&auml; enint&auml;&auml;n {0} merkki&auml;."),
minlength: $.validator.format("V&auml;hint&auml;&auml;n {0} merkki&auml;."),
rangelength: $.validator.format("Sy&ouml;t&auml; v&auml;hint&auml;&auml;n {0} ja enint&auml;&auml;n {1} merkki&auml;."),
range: $.validator.format("Sy&ouml;t&auml; arvo {0} ja {1} v&auml;lilt&auml;."),
max: $.validator.format("Sy&ouml;t&auml; arvo joka on pienempi tai yht&auml; suuri kuin {0}."),
min: $.validator.format("Sy&ouml;t&auml; arvo joka on yht&auml; suuri tai suurempi kuin {0}.")
});
}(jQuery));

Some files were not shown because too many files have changed in this diff Show More