JSFiddle - React, Tailwind, and code Playground

by damyanpetev

HTML

<script src="http://dev.igniteui.local/15-1/js/modernizr.min.js"></script>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
<script src="http://dev.igniteui.local/15-1/IgniteUI/js/infragistics.core.js"></script>
<script src="http://dev.igniteui.local/15-1/IgniteUI/js/infragistics.lob.js"></script>
<link href="http://dev.igniteui.local/15-1/IgniteUI/css/themes/infragistics/infragistics.theme.css" rel="stylesheet"></link>
<link href="http://dev.igniteui.local/15-1/IgniteUI/css/structure/infragistics.css" rel="stylesheet"></link>

<div class="currencyEditors">
        <h4>Default Configuration</h4>
        <div id="defaultCurrencyEditor"></div>
    
        <h4>Number Pattern Configuration</h4>
        <div id="currencyEditor"></div>

        <h4>Symbol and Separator Configuation</h4>
        <div id="currencyEditor2"></div>
    </div>

CSS

.currencyEditors h4 {
            margin-bottom:.5em;
        }

JavaScript

$(function () {
            $('#defaultCurrencyEditor').igNumericEditor({
            		button : "dropdown, spin, clear",
                spinDelta: 1,
                readOnly: true,
                 dropDownOnReadOnly: true,
                  spinOnReadOnly: true,
						 		listItems: [50, 20, 30, 40, 60, 70, 80, 90, 10],
                listMatchOnly: true,
                //listMatchIgnoreCase: false
            });

            $('#currencyEditor').igCurrencyEditor({
                width: 200,
                value: -8709.98,
                negativePattern: "$ -n",
                postivePattern: "$ n"
            });

            $('#currencyEditor2').igCurrencyEditor({
                width: 200,
                value: 1264.89,
                currencySymbol: "€",
                currencyDecimalSeparator: ",",
                currencyGroupSeparator: ""
            });

        });