0

I am using a ionRangeSlider for price range:

HTML

<input class="range-slider" id="price_range">

JS

        $("#price_range").ionRangeSlider({
            min: 0,
            max: 10000,
            type: "double",
            grid: false,
            step: 500,
            force_edges: true,
            decorate_both: false,
            prettify_enabled: true,
            onChange: function (data) {
                $('#loading').show();
                window.location.replace("@Url");
            },
        });

I want to add a delay of 2 seconds on onChange before redirecting to the url.

I have looked into the documentation but I can't find how to add a delay to the onChange event.

Any help would be appreciated

HelpASisterOut
  • 3,085
  • 16
  • 45
  • 89

1 Answers1

0

Maybe you can try something like this - 

<body>
    <select id="select">
        <option>1</option>
        <option>2</option>
        <option>3</option>
    </select>
    <script>
        var wto;
        $('#select').change(function() {
          wto = setTimeout(function() {
            // write your code here
            console.log('something changed');
          }, 2000);
        });
    </script>
</body>

This change gets triggered whenever a new value is selected from the drop-down, but the alert will come after 2 seconds only.

Try this and let me know if you're looking for something else.

Pranjal Successena
  • 907
  • 1
  • 11
  • 24
  • Select object does not help me in my case. I need a slide ranger – HelpASisterOut Jun 03 '18 at 20:16
  • try thi,setTimeout(function() { $('#loading').show(); window.location.replace("@Url"); }, 2000); – Pranjal Successena Jun 03 '18 at 20:56
  • If I apply this and someone slides the ranger multiple times, there will be multiple calls to the same URL with 2 seconds difference between them. What i need is that these instructions in 'onChange' won't be triggered until 2 seconds after sliding the range-slider – HelpASisterOut Jun 04 '18 at 14:41