Coder Social home page Coder Social logo

customd / jquery-number Goto Github PK

View Code? Open in Web Editor NEW
442.0 60.0 403.0 522 KB

Easily format numbers for display use. Replace numbers inline in a document, or return a formatted number for other uses.

Home Page: https://www.customd.com/articles/14/jquery-number-format-redux

License: MIT License

JavaScript 100.00%

jquery-number's Introduction

jQuery Number Plugin

By Sam Sehnert, Custom D 2015

This is a jQuery plugin which allows developers to easily format numbers for display use. Allows users to replace numbers inline in a document, or return a formatted number for other uses.

Requires jQuery 1.6 or greater.

Documentation

See our jQuery Number Format article for more information.

Basic number formatting

The number method takes up to four parameters, but only the first one is required.

  1. Number: The number you want to format.

    $.number( 5020.2364 ); // Outputs 5,020
  2. Decimal Places: The number of decimal places you wish to see. Defaults to 0.

    $.number( 5020.2364, 2 ); // Outputs: 5,020.24
  3. Decimal Separator: The character(s) to use as a decimal separator. Defaults to '.'.

    $.number( 135.8729, 3, ',' ); // Outputs: 135,873
  4. Thousands Separator: The character(s) to use as a thousands separator. Defaults to ','.

    $.number( 5020.2364, 1, ',', ' ' ); // Outputs: 5 020,2	

Number formatting as-you-type

When targeting a collection of input elements, you can have the number format plugin automatically format the users input based on your format settings.

$('input.number').number( true, 2 );

Passing true to the number parameter, indicates that you want the value of the field or element to be effected, instead of placing the passed number into the field or element. All other parameters are as decribed above.

When the user types, their input will automatically be converted in the correct format. This also attaches .val() hooks which allow you to continue using .val() to set your input elements, and you don't need to worry about handling the formatting.

Automatic paste formatting is also supported.

Writing numbers into an element

$('.selector').number( 1234, 2 ); // Changes the text value of the element matching selector to the formatted number.

Formatting numbers within a collection of elements

Assuming we have the following structure:

<p>
  <span class="number">1025.8702</span>
  <span class="number">18023</span>
  <span class="number">982.3</span>
  <span class="number">.346323</span>
</p>

We can use this JavaScript:

// the 'true' signals we should read and replace the text contents of the target element.
$('span.number').number( true, 2 )

And come away with this result:

<p>
  <span class="number">1,025.87</span>
  <span class="number">18,023.00</span>
  <span class="number">982.30</span>
  <span class="number">0.35</span>
</p>

jquery-number's People

Contributors

arsensokolov avatar asjamsuri avatar harlanlewis avatar indrimuska avatar invader444 avatar janher avatar richarddavies avatar robinherbots avatar samatcd avatar saturate avatar shtumi avatar stokito avatar teltploek avatar vicgor avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

jquery-number's Issues

AZERTY keyboard problem

There is a problem with AZERTY keyboards : numbers typed via the SHIFT + number combo are ignored due to the "get shifted keyCode value" feature of the plugin :
See lines 205-28 :

} else if (e.shiftKey && _keydown.shifts.hasOwnProperty(code)){
 //get shifted keyCode value
 chara = _keydown.shifts[code];
}

On AZERTY keayboards, numbers and symols are inverted : symbol is default. Eg: SHIFT+&=1

AZERTY

Numpad keys are not working in Google Chrome.

System:

Browser: Chrome 25
OS: Windows Server 2008, Windows 7

Issue

Pressing the Numpad keys does nothing in Google Chrome. Works fine in IE10 & Firefox. Logging the keyCode returns the same value in Firefox and Chrome.

Ones Back space after data causing incorrect position with decimals

  1. After pressing back space and one number the position caret is changed to right side of decimal point

  2. when we enter 2 to 3 time new number on same text box that is also caret is changed to right side of decimal point

I have added patch code of issue 13
Link is : #13

you can check that issue on below link
http://mccoyinfotech.com/Demo/examples/demo-as-you-type.html
Check above link for this issue
Please help me to sort out this issue

Can't set null in field

Hi,
if I want set an empty value in a text field ($("#myfield").val("") or .val(null)) the plugin convert the null or empty value in a "0" formatted value.

I can't execute un reset in the form.

Thanks
Claudio

Unwanted decimal

Thanks for this wonderful plugin. I'm having a problem when using this on an input. The input has a default value in it, when I try to highlight and change the value it automatically puts "0." at the beginning. I delete that, then start inputting numbers, it will put the first character in the second position. Very weird, and cannot seem to do anything to fix this.

I'm using: $('input.auto').number(true, 0);

Using FF.

Ideas?

Min, max and data attributes support

Why not adding support for min & max and data-{?} attributes.

Hint (coffeescript):

  $("input.numeric").attr("type", "text").each ->
    el = $(this)
    el.number(true, parseInt(el.attr("data-precision")), el.attr("data-separator"), el.attr("data-delimiter")).blur ->
      max = parseFloat($(this).attr("data-max"))
      min = parseFloat($(this).attr("data-min"))
      val = parseFloat($(this).val())
      $(this).val(max) if max? && val > max
      $(this).val(min) if min? && val < min

.number('remove') method

@stass-1 wrote the following in issue #11. I've moved it here, as 11 was the thread for a separate issue.

How I can remove .number ?

It's not working:
$('#post').submit(function() {
var price = price_input.val();
$price_input.unbind();
$price_input.val(price);
});

Different formatting for submitted value (vs. displayed value)?

First, thanks for the great plugin. Does nearly exactly what I'm looking for!

One thing I'm trying to do is show the number formatted with commas (e.g. "1,234.56") but when the number is submitted, I'd like it to submit with out the commas ("1234.56"). Is this possible with the current plugin? Is there somewhere I can hook in and modify the value? Thanks!

Force input to start at decimal

I am in the need to have a value in a field like: 0.341

I need the filed to maintain the 0.000 format at all times. All the plugins out there seem to only allow the user to adjust the whole number and not the decimal.. The input will not allow decimal input and what I need to accomplish is a strict format of 0.000 and have the user input start from the right and fill out from right-to-left. I don't believe this is currently available with this plugin but that's the only problem I have so far...

This would be a great feature if this was supported!

Thanks for the great plugin!

How to not allow round off?

How can I not allow the round off? because example if I have value of
999,999,999,999,999.99 it will round off to 1,000,000,000,000,000.00 In my case I need an exact value that I entered in the textbox, It will still remain to 999,999,999,999,999.99 is that possible? thanks.

Delete key support

It'd be nice if the code let you use the delete key (46). It only seems to support using the backspace key currently.

Function Key Events Not Passed to Browser

Key events on function buttons like F5 to refresh aren't passed to the browser when the focus is on the number input. However, $(document).keyup(); receives the event

Core format issue

jQuery.number( 135.8729, 3, ',' )
outputs '1,358,729,000' instead of '135,873'

what abut 0

when i type 0. dont type, if i put .36 i'll like the number 0.36 but is 36 :) what's wrong you or me?

Changing Comma Seperator

Maybe I am mistaken, but is this the desired behavior when changing the decimal separator to comma?

$.number(235.29, 2, ',')
“23,529,00"

I would expect 235,29 instead.

Thank you.

Only write decimals if they aren't 0?

Hello,

Thanks for this plugin, it works pretty fine. I was wondering, it is possible to only write the decimals if they aren't zero?

If not is that a feature you would consider? In my case it makes no sense to display the decimals if they are zero.

Thanks!

Uninitialized data causing incorrect position with decimals

The first time you press backspace on the right side of the decimal point, the position of the cursor is not set properly -- it skips to the left one more than it should. I created this example to illustrate: http://cdpn.io/baeDF.

If you click between the 6 and the 7 and hit backspace (delete on a mac), it changes the text to 1,234.507 like it should, but it sets the cursor to the left of the 5 instead of the 0. After you try to do this again, it works as it should.

After inspecting the code, it appears to be caused by line 375: start = this.value.length-decimals-( data.init < 0 ? 1 : 0 );. This makes start be 1 less than it should be (for this case).

I'd submit a pull request, but I'm not sure how else this line is supposed to be used. It looks like data.init can be set to -1, 0, and false in different places.

as-you-type with custom decimal separator is not working

Using space as decimal separator makes input ususable:

<head>
<script src="/js/jquery.min.js" type="text/javascript"></script>
<script src="/js/jquery.number.js" type="text/javascript"></script>
</head>

<input id="t" value="1234">
<script>
$(document).ready(function(){
    $('#t').number(true, 2, ' ');
});
</script>

Firefox 29

i have problem with Firefox version 29.

NS_ERROR_FAILURE:
else if(typeof(this['selection'+part])!="undefined")

Error in number formatting with decimal separator ","

When:
I apply an AS-U-TYPE on a input type=text valorized YET (es. 10.200)

What I do:
$('.number').number( true, 3, ',', '.' );
Notice:
decimal symbol, a comma
thousan symbol, a full stop

What I get:
An input type valorized with string: 10.200,000
The value of element is (accessing by .val) 10200

This behavior is in disagreement with I think it must be.
I'm expected an input type valorized with: 10,200

And this is the comportamet I find if:

  • apply the function $('.number').number( true, 3, ',', '.' ); on an EMPTY text
  • write on it with .val('10.200')
  • I get an input type valorized with 10,200
  • The value (with val funcion) is 10.200

Thanks

Multiple ID's fields problem

Hi,

I have same #id of multiple price input fields. For example; when I type a number to first input everything ok. but second input doesn't work correctly.

Example Page;
http://www.tehlikeliatik.com:7080/test/firma/tasmetal-kimya-san-ve-tic-ltd-sti-/741
You need to look right side "Miktar" is number format. And add new field with green button. Every fields id's same id="atik_miktari".

My javascript code is
$(function(){
// Atik miktari number format
$('#atik_miktari').number(true, 0,'', '.' );
});

How to make this correctly.

Thanks

Negative Toggling

Allow toggling of negative sign by pressing "-". A parameter should disable/enable this feature. Or if a Min/Max parameter is added, the number must be checked against the min/max before the negative sign is applied or removed

maxlength exceeded when holding key pressed or when pasting

The plugin inserts the decimal and group separators only at keyup, so if I'm holding a digit key down a few times I can insert more digits than allowed by the maxlength attribute which otherwise (pressing digits one by one) works fine.

Same maxlength issue with pasting a large number..

[enhancement] Add missing bower.json.

Hey, maintainer(s) of teamdf/jquery-number!

We at VersionEye are working hard to keep up the quality of the bower's registry.

We just finished our initial analysis of the quality of the Bower.io registry:

7530 - registered packages, 224 of them doesnt exists anymore;

We analysed 7306 existing packages and 1070 of them don't have bower.json on the master branch ( that's where a Bower client pulls a data ).

Sadly, your library teamdf/jquery-number is one of them.

Can you spare 15 minutes to help us to make Bower better?

Just add a new file bower.json and change attributes.

{
  "name": "teamdf/jquery-number",
  "version": "1.0.0",
  "main": "path/to/main.css",
  "description": "please add it",
  "license": "Eclipse",
  "ignore": [
    ".jshintrc",
    "**/*.txt"
  ],
  "dependencies": {
    "<dependency_name>": "<semantic_version>",
    "<dependency_name>": "<Local_folder>",
    "<dependency_name>": "<package>"
  },
  "devDependencies": {
    "<test-framework-name>": "<version>"
  }
}

Read more about bower.json on the official spefication and nodejs semver library has great examples of proper versioning.

NB! Please validate your bower.json with jsonlint before commiting your updates.

Thank you!

Timo,
twitter: @versioneye
email: [email protected]
VersionEye - no more legacy software!

A whole selection & over-writing cursor position issue

First of all, thanks for a neat script!

I'm using 69ce868a16 in Chrome.
I use it in an input field with these arguments:

decimals = 2
dec_point = "."
thousands_sep = " "

There's already some number in it. If I select the whole number (with either Ctrl+A or mouse) and then try to enter "1234", it will enter some digits before the decimal point and then cursor will skip right of the decimal point so it will look like "1.23" or "12.34" (depends on typing speed). Which, I suppose, isn't right, since the user haven't typed the decimal point.

My quick workaround is:

// The whole lot has been selected, or if the field is empty...
if( start == 0 && end == this.value.length || $this.val() == 0 )
    if( code === 8 )
    {
    // ...
    }
    // ...
    else // If the user is entering a digit, let him do it before the decimal point
    {
        data.init = -1;
        data.c = 0;
    }

Which, for sure, isn't perfect (I didn't check if the user's really pressing a digit key). But it seems that it does its job for me.

Chrome bug with numeric keyboard

I'm trying to format a number in a input, setting as decimal separator as "," (comma).

When I use the "," from the left of the keyboard, it works for entering the decimal part.
But, when I use the "," from the right of the keyboard (numeric keyboard), it doesn't works.

Try this example in Chrome/IE/Firefox to reproduce the bug:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>NUMBER FORMAT</title>

    <script type="text/javascript" src='jquery.min.js'></script>

    <script type="text/javascript">
        (function(e){"use strict";function t(e,t){if(this.createTextRange){var n=this.createTextRange();n.collapse(true);n.moveStart("character",e);n.moveEnd("character",t-e);n.select()}else if(this.setSelectionRange){this.focus();this.setSelectionRange(e,t)}}function n(e){var t=this.value.length;e=e.toLowerCase()=="start"?"Start":"End";if(document.selection){var n=document.selection.createRange(),r,i,s;r=n.duplicate();r.expand("textedit");r.setEndPoint("EndToEnd",n);i=r.text.length-n.text.length;s=i+n.text.length;return e=="Start"?i:s}else if(typeof this["selection"+e]!="undefined"){t=this["selection"+e]}return t}var r={codes:{46:127,188:44,109:45,190:46,191:47,192:96,220:92,222:39,221:93,219:91,173:45,187:61,186:59,189:45,110:46},shifts:{96:"~",49:"!",50:"@",51:"#",52:"$",53:"%",54:"^",55:"&",56:"*",57:"(",48:")",45:"_",61:"+",91:"{",93:"}",92:"|",59:":",39:'"',44:"<",46:">",47:"?"}};e.fn.number=function(i,s,o,u){u=typeof u==="undefined"?",":u;o=typeof o==="undefined"?".":o;s=typeof s==="undefined"?0:s;var a="\\u"+("0000"+o.charCodeAt(0).toString(16)).slice(-4),f=new RegExp("[^"+a+"0-9]","g"),l=new RegExp(a,"g");if(i===true){if(this.is("input:text")){return this.on({"keydown.format":function(i){var a=e(this),f=a.data("numFormat"),l=i.keyCode?i.keyCode:i.which,c="",h=n.apply(this,["start"]),p=n.apply(this,["end"]),d="",v=false;if(r.codes.hasOwnProperty(l)){l=r.codes[l]}if(!i.shiftKey&&l>=65&&l<=90){l+=32}else if(!i.shiftKey&&l>=69&&l<=105){l-=48}else if(i.shiftKey&&r.shifts.hasOwnProperty(l)){c=r.shifts[l]}if(c=="")c=String.fromCharCode(l);if(l!=8&&l!=45&&l!=127&&c!=o&&!c.match(/[0-9]/)){var m=i.keyCode?i.keyCode:i.which;if(m==46||m==8||m==127||m==9||m==27||m==13||(m==65||m==82||m==80||m==83||m==70||m==72||m==66||m==74||m==84||m==90||m==61||m==173||m==48)&&(i.ctrlKey||i.metaKey)===true||(m==86||m==67||m==88)&&(i.ctrlKey||i.metaKey)===true||m>=35&&m<=39||m>=112&&m<=123){return}i.preventDefault();return false}if(h==0&&p==this.value.length||a.val()==0){if(l==8){h=p=1;this.value="";f.init=s>0?-1:0;f.c=s>0?-(s+1):0;t.apply(this,[0,0])}else if(c==o){h=p=1;this.value="0"+o+(new Array(s+1)).join("0");f.init=s>0?1:0;f.c=s>0?-(s+1):0}else if(l==45){h=p=2;this.value="-0"+o+(new Array(s+1)).join("0");f.init=s>0?1:0;f.c=s>0?-(s+1):0;t.apply(this,[2,2])}else{f.init=s>0?-1:0;f.c=s>0?-s:0}}else{f.c=p-this.value.length}f.isPartialSelection=h==p?false:true;if(s>0&&c==o&&h==this.value.length-s-1){f.c++;f.init=Math.max(0,f.init);i.preventDefault();v=this.value.length+f.c}else if(l==45&&(h!=0||this.value.indexOf("-")==0)){i.preventDefault()}else if(c==o){f.init=Math.max(0,f.init);i.preventDefault()}else if(s>0&&l==127&&h==this.value.length-s-1){i.preventDefault()}else if(s>0&&l==8&&h==this.value.length-s){i.preventDefault();f.c--;v=this.value.length+f.c}else if(s>0&&l==127&&h>this.value.length-s-1){if(this.value==="")return;if(this.value.slice(h,h+1)!="0"){d=this.value.slice(0,h)+"0"+this.value.slice(h+1);a.val(d)}i.preventDefault();v=this.value.length+f.c}else if(s>0&&l==8&&h>this.value.length-s){if(this.value==="")return;if(this.value.slice(h-1,h)!="0"){d=this.value.slice(0,h-1)+"0"+this.value.slice(h);a.val(d)}i.preventDefault();f.c--;v=this.value.length+f.c}else if(l==127&&this.value.slice(h,h+1)==u){i.preventDefault()}else if(l==8&&this.value.slice(h-1,h)==u){i.preventDefault();f.c--;v=this.value.length+f.c}else if(s>0&&h==p&&this.value.length>s+1&&h>this.value.length-s-1&&isFinite(+c)&&!i.metaKey&&!i.ctrlKey&&!i.altKey&&c.length===1){if(p===this.value.length){d=this.value.slice(0,h-1)}else{d=this.value.slice(0,h)+this.value.slice(h+1)}this.value=d;v=h}if(v!==false){t.apply(this,[v,v])}a.data("numFormat",f)},"keyup.format":function(r){var i=e(this),o=i.data("numFormat"),u=r.keyCode?r.keyCode:r.which,a=n.apply(this,["start"]),f=n.apply(this,["end"]),l;if(a===0&&f===0&&(u===189||u===109)){i.val("-"+i.val());a=1;o.c=1-this.value.length;o.init=1;i.data("numFormat",o);l=this.value.length+o.c;t.apply(this,[l,l])}if(this.value===""||(u<48||u>57)&&(u<96||u>105)&&u!==8&&u!==46&&u!==110)return;i.val(i.val());if(s>0){if(o.init<1){a=this.value.length-s-(o.init<0?1:0);o.c=a-this.value.length;o.init=1;i.data("numFormat",o)}else if(a>this.value.length-s&&u!=8){o.c++;i.data("numFormat",o)}}if(u==46&&!o.isPartialSelection){o.c++;i.data("numFormat",o)}l=this.value.length+o.c;t.apply(this,[l,l])},"paste.format":function(t){var n=e(this),r=t.originalEvent,i=null;if(window.clipboardData&&window.clipboardData.getData){i=window.clipboardData.getData("Text")}else if(r.clipboardData&&r.clipboardData.getData){i=r.clipboardData.getData("text/plain")}n.val(i);t.preventDefault();return false}}).each(function(){var t=e(this).data("numFormat",{c:-(s+1),decimals:s,thousands_sep:u,dec_point:o,regex_dec_num:f,regex_dec:l,init:this.value.indexOf(".")?true:false});if(this.value==="")return;t.val(t.val())})}else{return this.each(function(){var t=e(this),n=+t.text().replace(f,"").replace(l,".");t.number(!isFinite(n)?0:+n,s,o,u)})}}return this.text(e.number.apply(window,arguments))};var i=null,s=null;if(e.isPlainObject(e.valHooks.text)){if(e.isFunction(e.valHooks.text.get))i=e.valHooks.text.get;if(e.isFunction(e.valHooks.text.set))s=e.valHooks.text.set}else{e.valHooks.text={}}e.valHooks.text.get=function(t){var n=e(t),r,s,o=n.data("numFormat");if(!o){if(e.isFunction(i)){return i(t)}else{return undefined}}else{if(t.value==="")return"";r=+t.value.replace(o.regex_dec_num,"").replace(o.regex_dec,".");return(t.value.indexOf("-")===0?"-":"")+(isFinite(r)?r:0)}};e.valHooks.text.set=function(t,n){var r=e(t),i=r.data("numFormat");if(!i){if(e.isFunction(s)){return s(t,n)}else{return undefined}}else{var o=e.number(n,i.decimals,i.dec_point,i.thousands_sep);return t.value=o}};e.number=function(e,t,n,r){r=typeof r==="undefined"?",":r;n=typeof n==="undefined"?".":n;t=!isFinite(+t)?0:Math.abs(t);var i="\\u"+("0000"+n.charCodeAt(0).toString(16)).slice(-4);var s="\\u"+("0000"+r.charCodeAt(0).toString(16)).slice(-4);e=(e+"").replace(".",n).replace(new RegExp(s,"g"),"").replace(new RegExp(i,"g"),".").replace(new RegExp("[^0-9+-Ee.]","g"),"");var o=!isFinite(+e)?0:+e,u="",a=function(e,t){var n=Math.pow(10,t);return""+Math.round(e*n)/n};u=(t?a(o,t):""+Math.round(o)).split(".");if(u[0].length>3){u[0]=u[0].replace(/\B(?=(?:\d{3})+(?!\d))/g,r)}if((u[1]||"").length<t){u[1]=u[1]||"";u[1]+=(new Array(t-u[1].length+1)).join("0")}return u.join(n)}})(jQuery)

        $(document).ready(function(){
            $('#valor').number(true, 2, ',', '');
        });

    </script>
</head>
<body>
    <input id="valor">
</body>
</html>

Negative numbers not supported

In at least the selector-based formatting, negative numbers are replaced with their absolute value. This is easily corrected for my purposes by adding - to the regex on line 142 of jquery.number.js.

I haven't submitted a pull request because I'm not really familiar with the rest of the functionality here, but I wanted to bring this issue to your attention. Thanks!

Numpad comma not working

There is a problem with this plugin not detecting decimal comma on numeric pad, works fine on comma key otherwise. This is the configuration I'm using:

$('#inputValue,#inputValueYear').number(true, 2, ',', '.' );

To temporary fix this I've changed line 101 from
110 : 46 //IE Key codes
to
110 : 44 //IE Key codes
and it works now.... but no idea what else I've broken with this. Is there a better way to fix this since "IE Key codes" are probably there for a reason?

Working wrong with Integer format.

First Issue:

$("#thousand-format").number(true);

Case 1:
Input >> 20
Output << 2
Case 2:
Input >> 123
Output >> 213

Secound Issue:

$("#thousand-format").number(true,1);
Case 1:
Input >> 2.1
Output << 1.0

Bug's round decimal

Hello
Hello

I've this problem

st = 123.45
rs = $.number(st, 0);

Result: 123
Result awaited : 124 (decimal rounded .45)

Excuse my english

Support input type = number

HTML5 supply input type = number for support input number more easier, but when I mix up with jquery.number it's not working. The console say it's not support.
Do you plan support input type = number in someday ? Thanks for reading my bad english 👍

How to use

Hi.

I want to format numbers showed in the example:
http://leafletjs.com/examples/choropleth.html

In some part of the code there is a couples of number without format.

I'm not be able to call the function to format number. The libs are correctly imported, but I don't know how to use this.

This is the code (grades is not formatted):

var legend = L.control({position: 'bottomright'});

legend.onAdd = function (map) {

var div = L.DomUtil.create('div', 'info legend'),
    grades = [0, 10, 20, 50, 100, 200, 500, 1000],
    labels = [];

// loop through our density intervals and generate a label with a colored square for each interval
for (var i = 0; i < grades.length; i++) {
    div.innerHTML +=
        '<i style="background:' + getColor(grades[i] + 1) + '"></i> ' +
        grades[i] + (grades[i + 1] ? '&ndash;' + grades[i + 1] + '<br>' : '+');
}

return div;

};

legend.addTo(map);

html5 input types

HTML5 input types are not supported.
This

<input type="number" />

will not work. You have to do it like this to work:

$("input[type=number]").attr("type", "text").number( true, 2 )

Question

I just wounder if it is possible to just split 5 numbers after 3 first så 12345 is going to be 123 45, I did try but with no result. Thx

You can't Copy/Paste data

Feature Request

The ability to copy data from a field is a pretty useful feature, and it does not require many changes .

The ability to paste data into a field would be nice. It could strip out letters or simply refuse to paste data that is not correct.

How to solve

Adding this after line 207 seems to work pretty well.

 // Allow: Ctrl+V, Ctrl+C
 ( (key == 86 || key == 67 ) && ( e.ctrlKey || e.metaKey ) === true ) || 

But if I paste in 5.000,45 it returns ´0,00´

It turns out this is a bug with the number formatter, try running $.number('6.000,56', 2 , ',', '.') it will return 0,00 and not 6.000,56.

Negative number

This plugin is great. Currently my project is using this. Can we add the support for negative number?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.