first commit
This commit is contained in:
5
jquery/number/numbertor/.gitignore
vendored
Normal file
5
jquery/number/numbertor/.gitignore
vendored
Normal file
@ -0,0 +1,5 @@
|
||||
#################
|
||||
## PhpStorm
|
||||
#################
|
||||
|
||||
.idea
|
20
jquery/number/numbertor/LICENSE
Normal file
20
jquery/number/numbertor/LICENSE
Normal file
@ -0,0 +1,20 @@
|
||||
The MIT License (MIT)
|
||||
|
||||
Copyright (c) 2014 Qodio
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy of
|
||||
this software and associated documentation files (the "Software"), to deal in
|
||||
the Software without restriction, including without limitation the rights to
|
||||
use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
|
||||
the Software, and to permit persons to whom the Software is furnished to do so,
|
||||
subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
|
||||
FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
|
||||
COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
|
||||
IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
|
||||
CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
79
jquery/number/numbertor/README.md
Normal file
79
jquery/number/numbertor/README.md
Normal file
@ -0,0 +1,79 @@
|
||||
Numbertor
|
||||
=======
|
||||
Numbertor is a jQuery-based addon for input boxes, giving them a number sanitizer.
|
||||
[You can see a demo here](http://opensource.qodio.com/numbertor).
|
||||
|
||||
|
||||
Usage
|
||||
-----
|
||||
###### include in head:
|
||||
```html
|
||||
<script src="jquery-1.11.0.min.js"></script>
|
||||
<script src="fm.numbertor.jquery.js"></script>
|
||||
```
|
||||
|
||||
###### to activate replacement:
|
||||
```javascript
|
||||
$('#inputBox').numbertor();
|
||||
```
|
||||
If you don't wan't to meddle with scripting, there is an alternative to activate replacement, by using inline markup.
|
||||
```html
|
||||
<input type="text" class="numbertor" data-numbertor-allow-empty="true">
|
||||
```
|
||||
|
||||
###### if you want to change settings:
|
||||
```javascript
|
||||
$('#inputBox').numbertor({
|
||||
decimals: 'auto', // number of decimals to use
|
||||
decimalSeperator: ',', // the decimal seperator to be used
|
||||
thousandSeperator: '.', // the thousand seperator to be used
|
||||
allowEmpty: false // if false, then value will be set to 0 when empty
|
||||
});
|
||||
```
|
||||
|
||||
|
||||
jQuery methods
|
||||
--------------
|
||||
Method | Description
|
||||
------------------ | -----------
|
||||
destroy | This method is used to remove the instance of the plugin from the input box.
|
||||
|
||||
|
||||
###### Method usage
|
||||
```javascript
|
||||
$('#inputBox').numbertor('destroy');
|
||||
```
|
||||
|
||||
|
||||
Browser compatibility
|
||||
---------------------
|
||||
* IE 8+
|
||||
* Chrome 3+
|
||||
* Firefox 3.6+
|
||||
* Safari 5+
|
||||
* Opera 10.5+
|
||||
|
||||
|
||||
|
||||
Copyright and license
|
||||
---------------------
|
||||
The MIT License (MIT)
|
||||
|
||||
Copyright (c) 2014 Qodio
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy of
|
||||
this software and associated documentation files (the "Software"), to deal in
|
||||
the Software without restriction, including without limitation the rights to
|
||||
use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
|
||||
the Software, and to permit persons to whom the Software is furnished to do so,
|
||||
subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
|
||||
FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
|
||||
COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
|
||||
IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
|
||||
CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
167
jquery/number/numbertor/fm.numbertor.jquery.js
Normal file
167
jquery/number/numbertor/fm.numbertor.jquery.js
Normal file
@ -0,0 +1,167 @@
|
||||
/*
|
||||
Numbertor jQuery Plugin
|
||||
Numbertor is a jQuery-based addon for input boxes, giving them a number sanitizer.
|
||||
version 1.1, Dec 11th, 2015
|
||||
by Ingi P. Jacobsen
|
||||
|
||||
The MIT License (MIT)
|
||||
|
||||
Copyright (c) 2014 Qodio
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy of
|
||||
this software and associated documentation files (the "Software"), to deal in
|
||||
the Software without restriction, including without limitation the rights to
|
||||
use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
|
||||
the Software, and to permit persons to whom the Software is furnished to do so,
|
||||
subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
|
||||
FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
|
||||
COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
|
||||
IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
|
||||
CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||
*/
|
||||
|
||||
(function($) {
|
||||
$.numbertor = function (element, options) {
|
||||
var defaults = {
|
||||
decimals: 'auto',
|
||||
decimalSeperator: ',',
|
||||
thousandSeperator: '.',
|
||||
allowEmpty: false
|
||||
};
|
||||
|
||||
var plugin = this;
|
||||
var $element = $(element);
|
||||
plugin.settings = {};
|
||||
|
||||
|
||||
// INITIALIZE PLUGIN
|
||||
plugin.init = function () {
|
||||
plugin.settings = $.extend({}, defaults, options);
|
||||
$element.addClass('numbertor');
|
||||
$element.bind('blur', sanitize);
|
||||
$element.bind('mouseup', unsanitize);
|
||||
$element.bind('mouseup', select);
|
||||
sanitize();
|
||||
};
|
||||
|
||||
plugin.refresh = function () {
|
||||
sanitize();
|
||||
};
|
||||
|
||||
var sanitize = function () {
|
||||
$element.val(sanitizeNumber($element.val(), plugin.settings.decimals, plugin.settings.decimalSeperator, plugin.settings.thousandSeperator));
|
||||
};
|
||||
|
||||
var unsanitize = function () {
|
||||
$element.val(unsanitizeNumber($element.val(), plugin.settings.decimals, plugin.settings.decimalSeperator, plugin.settings.thousandSeperator));
|
||||
};
|
||||
|
||||
var select = function () {
|
||||
$element.select();
|
||||
};
|
||||
|
||||
var sanitizeNumber = function (number, decimals, decimalSeperator, thousandSeperator) {
|
||||
decimals = decimals === undefined ? 'auto' : decimals;
|
||||
decimalSeperator = decimalSeperator === undefined ? ',' : decimalSeperator;
|
||||
thousandSeperator = thousandSeperator === undefined ? '.' : thousandSeperator;
|
||||
if (number !== '') {
|
||||
number = number.toString();
|
||||
number = number.replace(/[^0-9,\.]/g,'').replace(thousandSeperator, '').replace(decimalSeperator, '.');
|
||||
number = number_format(number, decimals, decimalSeperator, thousandSeperator);
|
||||
} else if (!plugin.settings.allowEmpty) {
|
||||
number = 0;
|
||||
number = number_format(number, decimals, decimalSeperator, thousandSeperator);
|
||||
}
|
||||
return number;
|
||||
};
|
||||
|
||||
var unsanitizeNumber = function (number, decimals, decimalSeperator, thousandSeperator) {
|
||||
decimals = decimals === undefined ? 'auto' : decimals;
|
||||
decimalSeperator = decimalSeperator === undefined ? ',' : decimalSeperator;
|
||||
thousandSeperator = thousandSeperator === undefined ? '.' : thousandSeperator;
|
||||
if (number !== '') {
|
||||
number = parseFloat(number.toString().replace(/\s/g, '').replace(thousandSeperator, '').replace(decimalSeperator, '.')).toString().replace('.', decimalSeperator);
|
||||
}
|
||||
return number;
|
||||
};
|
||||
|
||||
var number_format = function (number, decimals, dec_point, thousands_sep) {
|
||||
number = (number + '').replace(/[^0-9+\-Ee.]/g, '');
|
||||
var n = !isFinite(+number) ? 0 : +number,
|
||||
prec = !isFinite(+decimals) ? 0 : Math.abs(decimals),
|
||||
sep = (typeof thousands_sep === 'undefined') ? ',' : thousands_sep,
|
||||
dec = (typeof dec_point === 'undefined') ? '.' : dec_point,
|
||||
s = '',
|
||||
toFixedFix = function (n, prec) {
|
||||
var k = Math.pow(10, prec);
|
||||
return '' + Math.round(n * k) / k;
|
||||
};
|
||||
// Fix for IE parseFloat(0.55).toFixed(0) = 0;
|
||||
s = (prec ? toFixedFix(n, prec) : '' + Math.round(n)).split('.');
|
||||
if (s[0].length > 3) {
|
||||
s[0] = s[0].replace(/\B(?=(?:\d{3})+(?!\d))/g, sep);
|
||||
}
|
||||
if ((s[1] || '').length < prec) {
|
||||
s[1] = s[1] || '';
|
||||
s[1] += new Array(prec - s[1].length + 1).join('0');
|
||||
}
|
||||
return s.join(dec);
|
||||
};
|
||||
|
||||
|
||||
|
||||
// REMOVE PLUGIN AND REVERT INPUT ELEMENT TO ORIGINAL STATE
|
||||
plugin.destroy = function () {
|
||||
$element.removeClass('numbertor');
|
||||
$.removeData(element, 'numbertor');
|
||||
$element.unbind('blur', sanitize);
|
||||
$element.unbind('mouseup', select);
|
||||
$element.unbind('mouseup', unsanitize);
|
||||
$element.show();
|
||||
};
|
||||
|
||||
// Initialize plugin
|
||||
plugin.init();
|
||||
};
|
||||
|
||||
$.fn.numbertor = function(options) {
|
||||
options = options !== undefined ? options : {};
|
||||
return this.each(function () {
|
||||
if (typeof(options) === 'object') {
|
||||
if (undefined === $(this).data('numbertor')) {
|
||||
var plugin = new $.numbertor(this, options);
|
||||
$(this).data('numbertor', plugin);
|
||||
}
|
||||
} else if ($(this).data('numbertor')[options]) {
|
||||
$(this).data('numbertor')[options].apply(this, Array.prototype.slice.call(arguments, 1));
|
||||
} else {
|
||||
$.error('Method ' + options + ' does not exist in $.numbertor');
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
}(jQuery));
|
||||
|
||||
$(function () {
|
||||
$('.numbertor').each(function () {
|
||||
var $this = $(this);
|
||||
var options = {};
|
||||
$.each($this.data(), function (key, value) {
|
||||
if (key.substring(0, 9) == 'numbertor') {
|
||||
var value_temp = value.toString().replace(/'/g, '"');
|
||||
value_temp = $.parseJSON(value_temp);
|
||||
if (typeof value_temp == 'object') {
|
||||
value = value_temp;
|
||||
}
|
||||
options[key.substring(9, 10).toLowerCase() + key.substring(10)] = value;
|
||||
}
|
||||
});
|
||||
$this.numbertor(options);
|
||||
});
|
||||
});
|
111
jquery/number/numbertor/index.html
Normal file
111
jquery/number/numbertor/index.html
Normal file
@ -0,0 +1,111 @@
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link href="https://www.jqueryscript.net/css/jquerysctipttop.css" rel="stylesheet" type="text/css">
|
||||
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootswatch/3.3.7/flatly/bootstrap.css" rel="stylesheet" type="text/css">
|
||||
<title>jQuery Numbertor: Input Format Plugin Demos</title>
|
||||
<style>
|
||||
body {
|
||||
font-family: 'Roboto';
|
||||
background-color:#f7f7f7;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.container { margin:150px auto;}
|
||||
label {
|
||||
font-weight: bold;
|
||||
padding-top: 5px;
|
||||
display: block;
|
||||
}
|
||||
input {
|
||||
padding: 5px;
|
||||
font-size: 20px;
|
||||
}
|
||||
</style>
|
||||
<script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha384-nvAa0+6Qg9clwYCGGPpDQLVpLNn0fRaROjHqs13t4Ggj3Ez50XnGQqc/r8MhnRDZ" crossorigin="anonymous"></script>
|
||||
<script src="fm.numbertor.jquery.js"></script>
|
||||
<script>
|
||||
$(function () {
|
||||
$('#inputNumbertor1').numbertor();
|
||||
|
||||
$('#inputNumbertor2').numbertor({
|
||||
decimals: 2
|
||||
});
|
||||
|
||||
$('#inputNumbertor3').numbertor({
|
||||
decimals: 2,
|
||||
decimalSeperator: '.',
|
||||
thousandSeperator: ','
|
||||
});
|
||||
|
||||
$('#inputNumbertor4').numbertor({
|
||||
allowEmpty: false
|
||||
});
|
||||
|
||||
$('#inputNumbertor5').numbertor({
|
||||
allowEmpty: true
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="jquery-script-menu">
|
||||
<div class="jquery-script-center">
|
||||
<ul>
|
||||
<li><a href="https://www.jqueryscript.net/form/Number-Input-Format-Plugin-jQuery-Numbertor.html">Download This Plugin</a></li>
|
||||
<li><a href="https://www.jqueryscript.net/">Back To jQueryScript.Net</a></li>
|
||||
</ul>
|
||||
<div class="jquery-script-ads"><script type="text/javascript"><!--
|
||||
google_ad_client = "ca-pub-2783044520727903";
|
||||
/* jQuery_demo */
|
||||
google_ad_slot = "2780937993";
|
||||
google_ad_width = 728;
|
||||
google_ad_height = 90;
|
||||
//-->
|
||||
</script>
|
||||
<script type="text/javascript"
|
||||
src="https://pagead2.googlesyndication.com/pagead/show_ads.js">
|
||||
</script></div>
|
||||
<div class="jquery-script-clear"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="wrapper" class="container">
|
||||
<h1>jQuery Numbertor: Input Format Plugin Demos</h1>
|
||||
<label for="inputNumbertor1">default</label>
|
||||
<input id="inputNumbertor1" value="1234,567" class="form-control"><br>
|
||||
<br>
|
||||
<label for="inputNumbertor2">decimals: 2</label>
|
||||
<input id="inputNumbertor2" value="1234,567" class="form-control"><br>
|
||||
<br>
|
||||
<label for="inputNumbertor3">decimalSeperator: '.' and thousandSeperator: ',' (english standard) <i>Notice that the input must adhere to the standard as well</i></label>
|
||||
<input id="inputNumbertor3" value="1234.567" class="form-control">
|
||||
<br>
|
||||
<label for="inputNumbertor4">allowEmpty: false</label>
|
||||
<input id="inputNumbertor4" value="" class="form-control">
|
||||
<br>
|
||||
<label for="inputNumbertor5">allowEmpty: true</label>
|
||||
<input id="inputNumbertor5" value="" class="form-control">
|
||||
<br>
|
||||
<label for="inputNumbertor6">allowEmpty: true</label>
|
||||
<pre><input class="numbertor" id="inputNumbertor6" value="1234,567" data-numbertor-allow-empty="true"></pre>
|
||||
<input class="numbertor form-control" id="inputNumbertor6" value="1234,567" data-numbertor-allow-empty="true">
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
|
||||
var _gaq = _gaq || [];
|
||||
_gaq.push(['_setAccount', 'UA-36251023-1']);
|
||||
_gaq.push(['_setDomainName', 'jqueryscript.net']);
|
||||
_gaq.push(['_trackPageview']);
|
||||
|
||||
(function() {
|
||||
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
|
||||
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
|
||||
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
|
||||
})();
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
Reference in New Issue
Block a user