diff options
Diffstat (limited to 'resources/jquery/jquery.byteLimit.js')
| -rw-r--r-- | resources/jquery/jquery.byteLimit.js | 61 |
1 files changed, 46 insertions, 15 deletions
diff --git a/resources/jquery/jquery.byteLimit.js b/resources/jquery/jquery.byteLimit.js index c1d26fc4..10411924 100644 --- a/resources/jquery/jquery.byteLimit.js +++ b/resources/jquery/jquery.byteLimit.js @@ -6,24 +6,54 @@ ( function( $ ) { /** - * Enforces a byte limit to a textbox, so that UTF-8 entries are not arbitrarily truncated. + * Enforces a byte limit to a textbox, so that UTF-8 entries are counted as well, when, for example, + * a databae field has a byte limit rather than a character limit. + * Plugin rationale: Browser has native maxlength for number of characters, this plugin exists to + * limit number of bytes instead. + * + * Can be called with a custom limit (to use that limit instead of the maxlength attribute value), + * a filter function (in case the limit should apply to something other than the exact input value), + * or both. Order of arguments is important! + * + * @context {jQuery} Instance of jQuery for one or more input elements + * @param limit {Number} (optional) Limit to enforce, fallsback to maxLength-attribute, + * called with fetched value as argument. + * @param fn {Function} (optional) Function to call on the input string before assessing the length + * @return {jQuery} The context */ - $.fn.byteLimit = function( limit ) { + $.fn.byteLimit = function( limit, fn ) { + // If the first argument is the function, + // set fn to the first argument's value and ignore the second argument. + if ( $.isFunction( limit ) ) { + fn = limit; + limit = undefined; + } - // Default to current attribute value - if ( limit == null ) { - limit = this.attr( 'maxLength' ); + // Default limit to current attribute value + if ( limit === undefined ) { + limit = this.prop( 'maxLength' ); + } - // If passed, update/set attribute value instead + // Update/set attribute value, but only if there is no callback set. + // If there's a callback set, it's possible that the limit being enforced + // is too low (ie. if the callback would return "Foo" for "User:Foo"). + // Usually this isn't a problem since browsers ignore maxLength when setting + // the value property through JavaScript, but Safari 4 violates that rule, so + // we have to remove or not set the property if we have a callback. + if ( fn == undefined ) { + this.prop( 'maxLength', limit ); } else { - this.attr( 'maxLength', limit ); + this.removeProp( 'maxLength' ); } // Nothing passed and/or empty attribute, return without binding an event. - if ( limit == null ) { + if ( limit === undefined ) { return this; } + // Save function for reference + this.data( 'byteLimit-callback', fn ); + // We've got something, go for it: return this.keypress( function( e ) { // First check to see if this is actually a character key @@ -31,21 +61,22 @@ // Based on key-event info from http://unixpapa.com/js/key.html // jQuery should also normalize e.which to be consistent cross-browser, // however the same check is still needed regardless of jQuery. - + // Note: At the moment, for some older opera versions (~< 10.5) // some special keys won't be recognized (aka left arrow key). // Backspace will be, so not big issue. - + if ( e.which === 0 || e.charCode === 0 || e.which === 8 || e.ctrlKey || e.altKey || e.metaKey ) { return true; //a special key (backspace, etc) so don't interfere. } - - var len = $.byteLength( this.value ); - // Note that keypress returns a character code point, not a keycode. - // However, this may not be super reliable depending on how keys come in... - var charLen = $.byteLength( String.fromCharCode( e.which ) ); + + var val = fn !== undefined ? fn( $( this ).val() ): $( this ).val(), + len = $.byteLength( val ), + // Note that keypress returns a character code point, not a keycode. + // However, this may not be super reliable depending on how keys come in... + charLen = $.byteLength( String.fromCharCode( e.which ) ); if ( ( len + charLen ) > limit ) { e.preventDefault(); |