简体   繁体   中英

Rails: jQuery-ui-Slider-Pips: Error: no such method 'pips' for slider widget instance

Using the plugin from -> http://simeydotme.github.io/jQuery-ui-Slider-Pips/#getting-started Even though the slider loads, no Pips get loaded.

Rails 5 with JQuery

1: Downloaded  jquery-ui-slider-pips.css under myApp/app/assets/stylesheets

2: Downloaded jquery-ui-slider-pips.js under myApp/app/assets/javascripts

3: application.js 

//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require jquery-ui-slider-pips

4: application.css

 *= require jquery-ui-slider-pips

5: In the View
    <!-- include the jQuery and jQuery UI scripts -->
    <script src="https://code.jquery.com/jquery-2.1.1.js"></script>
    <script src="https://code.jquery.com/ui/1.11.1/jquery-ui.js"></script>

    <!-- plus a jQuery UI theme, here I use "flick" -->
    <link rel="stylesheet" href="https://code.jquery.com/ui/1.10.4/themes/flick/jquery-ui.css">

<div class="slider"></div>

<script type="text/javascript">
 $(function () {

    $(".slider")
        .slider({
            max: 12
        })
        .slider("pips", {
            rest: "label"
        });
 });
</script>

The slider loads with no pips and Error: no such method 'pips' for slider widget instance in browser console. Can anyone please help?

I think you need to add;

<script src="/path/to/jquery-ui-slider-pips.js"></script>

to your "view"... I don't know rails at all, so I'm taking a leap here.

Alternatively you can use the official source:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jQuery-ui-Slider-Pips/1.11.4/jquery-ui-slider-pips.js"></script>

But I do recognise that I've missed a crucial step in the docs which has the effect of making it seem unnecessary! I'll update as soon as I can

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM