Discussion :

[Rifton007]

Bonjour à tous et merci d'avance pour votre aide.

J'utilise les popover et y inclure des slider.
Je parviens à ajouter le slider dans le popover mais celui-ci n'est pas fonctionnel.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
$('.timeTable').on('click', function(){
        $('.timeTable').popover('hide');
        $(this).popover({
            animation : true,
            placement : 'bottom',
            selector : '#popover801689',
            html : true,
            content :  function() {
                return $('#pickTime').html();
            }
        });
        $(this).popover('toggle');
        return false; 
    });
 
    $(function() {
        $("#slider").slider({
            range: true,
            min: 0,
            max: 24,
            step: 0.5,
            values: [9, 10],
            slide: function( event, ui ) {
                $( "#amount" ).val( ui.values[ 0 ] + "-" + ui.values[ 1 ]);
            }
        });
        $("#amount").val($("#slider").slider("values", 0 ) +
                         $("#slider").slider("values", 1));
    });

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
<div id="pickTime"> <!--display none-->
    <input type="text" id="amount" readonly style="border:0; color:#f6931f; font-weight:bold;">
    <div id="slider"></div>
</div>
 
<a class="timeTable" data-toggle="popover" href="#monday">09:00-20:00</a>
<a class="timeTable" data-toggle="popover" href="#tuesday">09:00-20:00</a>

[NoSmoking]

Bonjour,

...mais celui-ci n'est pas fonctionnel.

cela n'aide pas beaucoup à la compréhension du problème.

[Rifton007]

Merci et navré pour ce manquement.

Pour être plus claire, il est comme désactivé, inactif.
Je pense que c'est lié au fait que je l'injecte dans le popover qui lui est crée dynamiquement.


#slider(celui du haut) est bien fonctionnel, mais quand je l'injecte dans le popover (en bas) il ne fonctionne pas.

[chris52]

Pourquoi tu ne met pas une classe carousel dans ton popover ?

[Rifton007]

Slider et carousel c'est deux choses différentes, même si certains utilisent le termes slidershow pour désigne une carousel.
Dans mon c'est bien un slider dont j'ai besoin.

Merci,

[chris52]

D'accord peut etre qu'il n'est pas "active"

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
<div class="well">
<a id="elem" class="timeTable" rel="popover" href="#monday" data-original-title="Mon Slide">09:00-20:00</a>
</div>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
 
var maxValue = 100,
    $slider = $('<div>').slider({
        range: "max",
        max: maxValue,
        min: maxValue / 5,
        value: maxValue / 2
    });
 
$('#elem')
    .popover({
        trigger: 'manual'
    })
    .click(function() {
        var $this = $(this);
 
        if ($this.toggleClass('active').hasClass('active')) {
            $this.popover('show');
            $('.popover-content')
                .empty()
                .append($slider);
        } else {
            $slider.detach();
            $this.popover('hide');
        }
    });

[Rifton007]

Nickel chrome, ça marche.
Merci.

[chris52]

Mais de rien =) n'oublie pas de mettre résolu à ton post