Immutable Brick
Immutable Brick

Reputation: 820

jQuery Mobile Slider create event not firing

First time I am using jquery mobile the slider create event seems to not want to fire.

According to jQuery Slider page the following events should work (create/start/stop), I did get start/stop to work but not the create, code below:

  <script>
      $(function () {
          $("#slider-s").slider({
              create: function (event, ui) {
                  console.log("creating");
              },
              start: function (event, ui) {
                  console.log("start moving");
              },
              stop: function (event, ui) {
                  console.log("stop moving");
              }
          });
      });
  </script>
  <input type="range" name="slider-s" id="slider-s" value="25" min="0" max="100" data-highlight="true">

So every time I move up the slider I get start moving and when I stop it I get stop moving but I thought I would get creating once the slider has been loaded/created.

Upvotes: 1

Views: 900

Answers (1)

Gajotres
Gajotres

Reputation: 57309

Working example: http://jsfiddle.net/Gajotres/6dQ9E/

The point is to use proper page event to detect right widget event. Also you should never used classic document ready with jQuery Mobile, sometimes it works just fine and sometimes it behaves extremely weird. That's why jQuery Mobile page events exist. Read more abut it here.

Javascript used:

$(document).on('pagecreate', '#index', function(){ 
    $(document).on('slidecreate', '#slider-s', function(){ 
        console.log("create");
    });    
    $(document).on('slidestart', '#slider-s', function(){ 
        console.log("start");
    });
    $(document).on('slidestop', '#slider-s', function(){ 
        console.log("stop");
    });    
});

Upvotes: 3

Related Questions