item-quantity-dropdown jQuery plugin

Dropdown menu to select items with quantities

!Demo

Dependencies:

- jquery: ^3.0.0

Installation

$3

- Download the script here and include it as shown below
- Download the stylesheet here and include it as shown below

``html


···



···



`

$3

`shell
yarn add item-quantity-dropdown


or

`javascript
import 'item-quantity-dropdown';
import 'item-quantity-dropdown/lib/item-quantity-dropdown.css';
require('item-quantity-dropdown');
require('item-quantity-dropdown/lib/item-quantity-dropdown.css');
`

Usage

$3

`html


`javascript
$(document).ready(() => {
$('.iqdropdown').iqDropdown({ [options] });
});
`

$3

#### Dropdown options using data attributes

`html


`html


`javascript
{
// max total items
maxItems: Infinity,
// min total items
minItems: 0,
// text to show on the dropdown override data-selection-text attribute
selectionText: 'item',
// text to show for multiple items
textPlural: 'items',
// optionally can use setSelectionText function to override selectionText
setSelectionText: (itemCount, totalItems) => { / return string / },
// buttons to increment/decrement
controls: {
position: 'right',
displayCls: 'iqdropdown-item-display',
controlsCls: 'iqdropdown-item-controls',
counterCls: 'counter'
},
// fires when an item quantity changes
onChange: (id, count, totalItems) => {},
// return false to prevent an item decrement
beforeDecrement: (id, itemCount) => {},
// return false to prevent an item increment
beforeIncrement: (id, itemCount) => {}
}
`

#### Selection text

Default value.

`javascript
${totalItems} item // if total items is 1
${totalItems} items // if total items is not 1
`

Data attribute data-selection-text override default value.

`html



`

Property selectionText override data attribute

`javascript
options.selectionText = 'item';
options.textPlural = 'items';
`

Function setSelectionText override selectionText property.

`javascript
options.setSelectionText = function setSelectionText(itemCount, totalItems)
`

Arguments:

- itemCount