I have a requirement to create "brackets" for permissions based off the amount of a transaction. For example, a user assigned to the $10-100 bracket should have permission to modify all transactions between $10.00 and $100.00.

What interface options are available that would allow me to define multiple brackets without any of the brackets overlapping? For instance, if there is a $10-100 bracket, there cannot be another bracket with a range of $50-$200.

As of now, I'm leaning toward showing a single form when editing/creating a bracket with text inputs for Minimum Amount and Maximum Amount, then using jQuery to check whether the range of those values overlaps with any existing brackets and displaying a context alert onChange ("The inputted range overlaps with an existing permission bracket"). However, I'm not sure if that's the best way of inputting these ranges or communicating the mutual exclusivity.

Ideally, there would be a number line that shows existing ranges and lets you create or modify ranges by dragging/highlighting. However, I couldn't find any existing libraries that have this functionality.

The only requirement is that the brackets cannot overlap.

Any ideas for best implementing this interface? Thanks! Any ideas are appreciated :) I can clarify the requirements if necessary.

1 Answer 1


Elessar is a library that lets you have one number line with multiple ranges that cannot overlap.


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.