Created
July 27, 2011 19:16
-
-
Save paveltyk/1110140 to your computer and use it in GitHub Desktop.
jQuery plugin to auto show/hide confirmation field
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/*! | |
* jQuery HideConfirmation Plugin | |
* version: 1.0 (27-JUL-2011) | |
* created by: PavelTyk https://github.com/PavelTyk | |
* | |
* This is a simple plugin to automatically hide confirmation fields if | |
* no changes made to observed field. | |
* | |
* Dual licensed under the MIT and GPL licenses: | |
* http://www.opensource.org/licenses/mit-license.php | |
* http://www.gnu.org/licenses/gpl.html | |
*/ | |
;(function($){ | |
/* | |
Usage Note: | |
----------- | |
HTML: | |
<input type="text" id="email" /> | |
<input type="text" id="email_confirmation" /> | |
JavaScript: | |
$(document).ready(function() { | |
$('#email').hideConfirmation(); | |
}); | |
Customization: | |
You can override two helper functions used to hide and show | |
confirmation field: | |
__hide:__ $.fn.hideConfirmation.hideConfirmationElement = function() {} | |
__show:__ $.fn.hideConfirmation.showConfirmationElement | |
Investigate source code to find out what is the default behavior :) | |
*/ | |
$.fn.hideConfirmation = function() { | |
return $(this).each(function() { | |
var element = $(this), | |
confirmation_element = $('#' + element.attr('id') + '_confirmation'), | |
initial_value = element.val(); | |
if (confirmation_element.val() == '') | |
$.fn.hideConfirmation.hideConfirmationElement(confirmation_element); | |
element.keyup(function(){ | |
if ($(this).val() == initial_value) | |
$.fn.hideConfirmation.hideConfirmationElement(confirmation_element) | |
else | |
$.fn.hideConfirmation.showConfirmationElement(confirmation_element) | |
}); | |
}); | |
}; | |
$.fn.hideConfirmation.hideConfirmationElement = function(element) { | |
element.hide().val('').prev('label').hide() | |
}; | |
$.fn.hideConfirmation.showConfirmationElement = function(element) { | |
element.show().prev('label').show(); | |
}; | |
})(jQuery); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment