JSFiddle - React, Tailwind, and code Playground

by leongersen

HTML

<link rel="stylesheet" href="http://refreshless.com/nouislider/source/jquery.nouislider.css">
<script src="http://refreshless.com/nouislider/source/jquery.nouislider.js"></script>
<div id="down"></div>
<input name="field" id="field" class="form-control">

JavaScript

var Link = $.noUiSlider.Link;

// On document ready, initialize noUiSlider.
$(function () {
    $('#down').noUiSlider({
        start: [500],
        connect: "lower",
        range: {
            'min': 100,
                'max': 5000
        },
        serialization: {
            lower: [
            // Write the values to
            // an input with id 'field'
            new Link({
                target: $("#field")
            })],
            format: {
                // Set formatting
                thousand: ' ',
                prefix: '$'
            }
        }

    });
});