Start again

vendors/validator/multifield.js

@@ -0,0 +1,60 @@
+// multifield - connects several input fields to each-other
+// By Yair Even Or / 2011 / dropthebit.com
+;(function(){
+	var fixedEvent = 0;
+	
+	function funnel(e){
+		fixedEvent++;
+		var that = this;
+		setTimeout(function(){
+			keypress.call(that, e);
+			fixedEvent = 0;
+		},0);
+	}
+	
+	function keypress(e){
+		var nextPrevField,
+			sel = [this.selectionStart, this.selectionEnd];
+
+		if( !e.charCode && e.keyCode != 37 && e.keyCode != 39 && e.keyCode != 8 )			
+			return;	
+
+		// if hit Backspace key when caret was at the beginning, or if the 'left' arrow key was pressed and the caret was at the start -> go back to previous field	
+		if( (e.keyCode == 8 && sel[1] == 0) || (e.keyCode == 37 && sel[1] == 0) )			
+			setCaret( $(this).prev(':text')[0], 100);
+		
+		// if the 'right' arrow key was pressed and caret was at the end -> advance to the next field
+		else if( e.keyCode == 39 && sel[1] == this.value.length )	
+			setCaret( $(this).next(':text')[0], 0);
+		
+		// automatically move to the next field once user has filled the current one completely		
+		else if( e.charCode && sel[1] == sel[0] && sel[0] == this.maxLength )
+			setCaret( $(this).next(':text')[0], 100);
+
+		function setCaret(input, pos){
+			if( !input ) return;
+			if (input.setSelectionRange){
+				input.focus();
+				input.setSelectionRange(pos, pos);
+			}
+			else if( input.createTextRange ){
+				var range = input.createTextRange();
+				range.collapse(true);
+				range.moveEnd('character', pos);
+				range.moveStart('character', pos);
+				range.select();
+			}
+		}
+		
+		combine.apply(this);
+	};
+	// After each 'change' event of any of the fields, combine all the values to the hidden input.	
+	function combine(){
+		var hidden =  $(this).siblings('input[type=hidden]').val('')[0];		
+		$(this.parentNode).find(':text').each( function(){			
+			hidden.value += this.value;
+		});
+	}
+
+	$('div.multi').on({'keydown.multifeild':funnel, 'keypress.multifeild':funnel, 'change.multifeild':combine}, 'input');
+})();