title: Passing an ID to a range using the Elessar library
body: <p>I'm using the Elessar library to create a multi-range selector: <a href="https://github.com/quarterto/Elessar" rel="nofollow">https://github.com/quarterto/Elessar</a></p>
  
  <p>Works great so far, except for one thing... I can't seem to find any functionality to pass an ID to pre-populated ranges. This is problematic if you need to update an existing range that you're loading from a database.</p>
  
  <p>Here are the options provided in the documentation:</p>
  
  <pre><code>new RangeBar({
    values: [], // array of value pairs; each pair is the min and max of the range it creates (Ex: [[50, 100], [150, 200]])
    readonly: false, // whether this bar is read-only
    min: 0, // value at start of bar
    max: 100, // value at end of bar
    valueFormat: function(a) {return a;}, // formats a value on the bar for output
    valueParse: function(a) {return a;}, // parses an output value for the bar
    snap: 0, // clamps range ends to multiples of this value (in bar units)
    minSize: 0, // smallest allowed range (in bar units)
    maxRanges: Infinity, // maximum number of ranges allowed on the bar
    bgMarks: {
      count: 0, // number of value labels to write in the background of the bar
      interval: Infinity, // provide instead of count to specify the space between labels
      label: id // string or function to write as the text of a label. functions are called with normalised     values.
    },
    indicator: null, // pass a function(RangeBar, Indicator, Function?) Value to calculate where to put a     current indicator, calling the function whenever you want the position to be recalculated
    allowDelete: false, // set to true to enable double-middle-click-to-delete
    deleteTimeout: 5000, // maximum time in ms between middle clicks
    vertical: false, // if true the rangebar is aligned vertically, and given the class elessar-vertical
    bounds: null, // a function that provides an upper or lower bound when a range is being dragged. call     with the range that is being moved, should return an object with an upper or lower key
    htmlLabel: false, // if true, range labels are written as html
    allowSwap: true // swap ranges when dragging past
  });
  </code></pre>
  
  <p>Ideally, I think, you should be able to pass the ranges with an ID ([min, max, id]) so that you can detect which range was actually changed when you update the slider.</p>
  
  <p>I think this issue off the project's GitHub may touch on it: <a href="https://github.com/quarterto/Elessar/issues/67" rel="nofollow">https://github.com/quarterto/Elessar/issues/67</a></p>
  
  <p>Is there something in the docs that I'm missing? This seems like it would be a necessary component.</p>
  
  <p>Thanks,
  Andrew</p>