How can I add “+” over a certain value with jQuery UI Slider

Question

I am trying to make a price slider with jQuery UI slider. What I want to do is add "+" when the handle reaches the max value. I added if statement but it didn't work.

<script>
$(function() {
    $( "#slider-range-min" ).slider({
        range: "min",
        value: 2,
        min: 1,
        max: 50,
        slide: function( event, ui ) {
            $( "#amount").val( ui.value + "K");
            if($( "#amount" ).val(ui.value)>50){
                $( "#amount" ).val( ui.value + "K+");
            }
         }
    });
    $( "#amount" ).val( $( "#slider-range-min" ).slider( "value" ) + "K");
});

If somebody knows how to do this, that would be great. Thank you!

Answer 1

The slide property should be:

slide: function( event, ui ) {
           if(ui.value>=50)
               $( "#amount" ).val( ui.value + "K+");
           else
               $( "#amount").val( ui.value + "K");
        }

The problem was that $( "#amount" ).val(ui.value) is used to set the value of #amount , but the value was already being passed in through the ui param. Also, since the maximum value for the slider is 50, then you will never get above it, so you must use >= or even just == would work as well.