0.1.77 • Published 7 years ago

easynumber v0.1.77

Weekly downloads
26
License
-
Repository
github
Last release
7 years ago

#easyNumbers

###Benefits

  • You can easily change numbers in inputs.
  • Operated increment or decrement of input value by define buttons.
  • Easily set readonly, format and validation of input value.

##Requirements 1. If you want use easyNumbers to date or time value, you need link Moment.js to your project.

##Installation

###Step 1: Install

npm install easynumber

###Step 2: Add module in ES6

import easynumber from 'easynumber';

###Step 3: Call the easyNumber

$('.quantity').easyNumber()

##Default options

defaults = {
    plus: '+',
    minus: '-',
    readonly: true,
    allowNegative: false,
    dateFormat: 'DD-MM-YYYY',
    timeFormat: 'HH:mm',
    type: 'int',
    validation: false,
    zero: null
};

##Configuration options

plus It's a button to increment the value.

default: '+'
options: string
example: 'plus'

minus It's a button to decrement the value.

default: '-'
options: string
example: 'minus'

readonly Sets up read only options to your input.

default: 'true'
options: boolean

allowNegative Allows to set negative numbers in input.

default: false
options: bool

dateFormat Sets up yours date format.

default: 'DD-MM-YYYY'
options: string
example: '20-11-2015'

timeFormat Sets up yours time format.

default: 'HH:mm'
options: string
example: '12:59'

type Sets up type of input and increments, decrements value.

default: 'int'
options: int, data, time

validation Check that user introduces right value input.

default: 'false'
option: numbers

zero Sets up starts input value.

default: null
options: number

##Alternative configuration

You can pass configuration options in data attribute of input element:

<input type="number" class="quantity" data-options='{"min": "minus", "max": "maximum"}'>

##Addictiona options

There are additional configuration options passed by data attribute on individual input

  1. Allowed float values on input
<input data-qty-float-val="true" class="quantity" type="text">
  1. Changed incrementation value.
<input data-qty-for-change="10" class="quantity" type="text">

##Full features example

$(document).ready(function(){
  $('.quantity').easyNumbers({
    plus: 'plus',
    minus: 'minus',
    readonly: true,
    allowNegative: true,
    dateFormat: 'DD-MM-YYYY',
    timeFormat: 'HH:mm',
    type: 'int',
    validation: 'true',
    zero: null
  });
});
0.1.77

7 years ago

0.1.76

7 years ago

0.1.75

7 years ago

0.1.74

7 years ago

0.1.73

7 years ago

0.1.72

7 years ago

0.1.71

7 years ago

0.1.7

7 years ago