faulknercs / Knockstrap

Knockout bindings to twitter bootstrap 3
faulknercs.github.io/Knockstrap/
MIT License
142 stars 37 forks source link

Popover with observable options not updating #44

Closed dhanlon closed 3 years ago

dhanlon commented 8 years ago

The documentation mentions the shorthand form data-bind="popover: popoverOptions", where popoverOptions can be an observable holding an object with bootstrap popover options.

I've tried this in your example, both making popoverOptions an observable, and with popoverOptions being an object but the trigger property being an observable. In both cases when the observable is updated the popover behaviour does not change from it's initial state.

Using the below, the popover will appear on a click, but after updating the trigger observable to 'hover' the popover still appears only on a click.

`function PopoverExampleViewModel() { var self = this;

self.popoverTemplate = ko.observable('firstPopoverTemplate');
self.popoverOptions = { content: 'Hey', trigger: ko.observable('click') };
self.switchTemplates = function() {
    self.popoverTemplate() === 'firstPopoverTemplate' ? self.popoverTemplate('secondPopoverTemplate') : self.popoverTemplate('firstPopoverTemplate');
};

}

        <button class="btn btn-primary" data-bind="popover: popoverOptions">Short hand</button>
        <div class="btn-group form-group" data-toggle="buttons" data-bind="radio: popoverOptions.trigger">
            <label class="btn btn-primary">
                <input type="radio" name="triggerOptions" value="hover" />
                Hover
            </label>
            <label class="btn btn-primary">
                <input type="radio" name="triggerOptions" value="click" />
                Click
            </label>
            <label class="btn btn-primary">
                <input type="radio" name="triggerOptions" value="manual" />
                Manual
            </label>
        </div>`
faulknercs commented 3 years ago

Thanks for the report! Due to the trigger implementation at bootstrap side it's impossible to change it after popover is created. I would recommend to control it on view model level and just render different popovers when you need change trigger type. Please, see this example: https://jsfiddle.net/faulknercs/s51736n2/