Skip to content
Browse files

Updating with the latest (and greatest) version from ClassBug.

This version removes the studder around the decimal point and cleans up a few minor bugs such as:
   - Prefix would apply to all moneyfield's on the same page
   - View would not grab the hidden field's value on init of the control

This version is much smoother and has been working very well in production for a few months
  • Loading branch information...
1 parent 225549d commit 9d055b5980904fbb37d102f6b376b08b8ed52f2f @johnsonj committed May 28, 2014
Showing with 162 additions and 23 deletions.
  1. +3 −1 README.md
  2. +56 −21 jquery.moneyfield.coffee
  3. +1 −1 jquery.moneyfield.html
  4. +102 −0 jquery.moneyfield.js
View
4 README.md
@@ -1,4 +1,6 @@
jquery-money-field
==================
-jQuery plugin for handling money input
+jQuery plugin for handling money input.
+
+Cleans up user entered data into a ###,###.## format and leaves a cent value in a hidden field. See the jquery.moneyfield.html for more details.
View
77 jquery.moneyfield.coffee
@@ -2,58 +2,93 @@ $ = jQuery
value_field_selector = "[data-money-field]"
defaults =
- prefix: '$'
+ prefix: ''
$.fn.extend \
moneyfield: (params) ->
- opt = $.extend(defaults, params)
-
this.each ->
+ opts = {}
+ $.extend(opts, defaults, params)
+
# Prevent multiple bindings
if $(this).data('money-field')
return this;
- $(this).data('money-field', opt)
+ $(this).data('money-field', opts)
# Bind to update on keys
- $(this).keyup update_value_field
$(this).keypress block_invalid_chars
+ $(this).focus update_view
+ $(this).focusout update_view
+ $(this).keyup update_value
+
# Set initial value
cursor_pos = $(this).caret().start;
- $val = get_value_field.call(this)
- $(this).val(convert_actual_to_friendly.call($val, opt.prefix))
- $(this).caret(cursor_pos,cursor_pos)
+ update_view.call(this)
+
+ $(this).caret(cursor_pos,cursor_pos)
this
+get_mode = ->
+ $(this).data('money-field').type_field.val()
+
get_value_field = ->
$(this).parent().find(value_field_selector)
-convert_input_to_actual = (prefix)->
- $(this).val().replace(/\./g,"").replace(prefix, "")
+get_prefix = ->
+ $(this).data('money-field').prefix
+
+convert_input_to_actual = (prefix, append_zeros=false)->
+ val_str = $(this).val().toString()
+ clean_value = parseInt(val_str.replace(/\./g,"").replace(/\$/g, "").replace(/,/g,""))
+
+ if append_zeros
+ # If there is no decimal place, then make add two 0's to it, aka * 100
+ # .. or if they put a decimal at the end and nothing after
+ if (val_str.indexOf('.') == -1 || val_str.indexOf('.') == (val_str.length - 1))
+ clean_value *= 100
+ # If there is a decimal place and 1 following, add one 0
+ else if val_str.indexOf('.') == (val_str.length - 2)
+ clean_value *= 10
+
+ clean_value
convert_actual_to_friendly = (prefix)->
dollars = $(this).val()/100
- if dollars == NaN
+ if isNaN(dollars)
dollars = 0
- "#{prefix}#{dollars.toFixed(2)}"
+ "#{prefix}#{dollars.toFixed(2).replace(/\B(?=(\d{3})+(?!\d))/g, ",");}"
+# Clean up the view after focus out
+update_view = ->
+ $val = get_value_field.call(this)
-update_value_field = ->
- cursor_pos = $(this).caret().start
- prefix = $(this).data('money-field').prefix
+ $(this).val(convert_actual_to_friendly.call($val, get_prefix.call(this), true))
+update_value = ->
$val = get_value_field.call(this)
- $val.val(convert_input_to_actual.call(this, prefix))
- $(this).val(convert_actual_to_friendly.call($val, prefix))
- $(this).caret(cursor_pos,cursor_pos)
+ actual_value = convert_input_to_actual.call(this, get_prefix.call(this), true)
+
+ if isNaN(actual_value)
+ actual_value = 0
+
+ $val.val actual_value
+
block_invalid_chars = (e)->
- if (isNaN(String.fromCharCode(e.which)) && String.fromCharCode(e.which) != ".")
- return false
+ str = String.fromCharCode(e.which)
+ str_int = parseInt(str)
+
+ !isNaN(str_int) or str == "." or str == "$" or str == ","
+
+
+# Publish some helpers!
+jquery_moneyfield_helpers =
+ convert_cents_to_friendly: convert_actual_to_friendly
- true
+window.jquery_moneyfield_helpers = jquery_moneyfield_helpers
View
2 jquery.moneyfield.html
@@ -28,7 +28,7 @@
<script>
$(function() {
$('#example1').moneyfield();
- $('#example2').moneyfield({prefix: 'Cash: '})
+ $('#example2').moneyfield({prefix: '$'})
});
</script>
View
102 jquery.moneyfield.js
@@ -0,0 +1,102 @@
+// Generated by CoffeeScript 1.4.0
+(function() {
+ var $, block_invalid_chars, convert_actual_to_friendly, convert_input_to_actual, defaults, get_mode, get_prefix, get_value_field, jquery_moneyfield_helpers, update_value, update_view, value_field_selector;
+
+ $ = jQuery;
+
+ value_field_selector = "[data-money-field]";
+
+ defaults = {
+ prefix: ''
+ };
+
+ $.fn.extend({
+ moneyfield: function(params) {
+ return this.each(function() {
+ var cursor_pos, opts;
+ opts = {};
+ $.extend(opts, defaults, params);
+ if ($(this).data('money-field')) {
+ return this;
+ }
+ $(this).data('money-field', opts);
+ $(this).keypress(block_invalid_chars);
+ $(this).focus(update_view);
+ $(this).focusout(update_view);
+ $(this).keyup(update_value);
+ cursor_pos = $(this).caret().start;
+ update_view.call(this);
+ $(this).caret(cursor_pos, cursor_pos);
+ return this;
+ });
+ }
+ });
+
+ get_mode = function() {
+ return $(this).data('money-field').type_field.val();
+ };
+
+ get_value_field = function() {
+ return $(this).parent().find(value_field_selector);
+ };
+
+ get_prefix = function() {
+ return $(this).data('money-field').prefix;
+ };
+
+ convert_input_to_actual = function(prefix, append_zeros) {
+ var clean_value, val_str;
+ if (append_zeros == null) {
+ append_zeros = false;
+ }
+ val_str = $(this).val().toString();
+ clean_value = parseInt(val_str.replace(/\./g, "").replace(/\$/g, "").replace(/,/g, ""));
+ if (append_zeros) {
+ if (val_str.indexOf('.') === -1 || val_str.indexOf('.') === (val_str.length - 1)) {
+ clean_value *= 100;
+ } else if (val_str.indexOf('.') === (val_str.length - 2)) {
+ clean_value *= 10;
+ }
+ }
+ return clean_value;
+ };
+
+ convert_actual_to_friendly = function(prefix) {
+ var dollars;
+ dollars = $(this).val() / 100;
+ if (isNaN(dollars)) {
+ dollars = 0;
+ }
+ return "" + prefix + (dollars.toFixed(2).replace(/\B(?=(\d{3})+(?!\d))/g, ","));
+ };
+
+ update_view = function() {
+ var $val;
+ $val = get_value_field.call(this);
+ return $(this).val(convert_actual_to_friendly.call($val, get_prefix.call(this), true));
+ };
+
+ update_value = function() {
+ var $val, actual_value;
+ $val = get_value_field.call(this);
+ actual_value = convert_input_to_actual.call(this, get_prefix.call(this), true);
+ if (isNaN(actual_value)) {
+ actual_value = 0;
+ }
+ return $val.val(actual_value);
+ };
+
+ block_invalid_chars = function(e) {
+ var str, str_int;
+ str = String.fromCharCode(e.which);
+ str_int = parseInt(str);
+ return !isNaN(str_int) || str === "." || str === "$" || str === ",";
+ };
+
+ jquery_moneyfield_helpers = {
+ convert_cents_to_friendly: convert_actual_to_friendly
+ };
+
+ window.jquery_moneyfield_helpers = jquery_moneyfield_helpers;
+
+}).call(this);

0 comments on commit 9d055b5

Please sign in to comment.
Something went wrong with that request. Please try again.