[support] Linked Pickers not working if component has :wrap="true"

[archer3cl]

I'm submitting a ... (check one with "x")

[  ] Bug report => search github for a similar issue or PR before submitting
[ ] Feature request
[x ] Other, please describe, support

Tell about your platform

• eonasdan-bootstrap-datetimepicker version : 4.17.47
• Vue.js version : 2.4.1
• Browser name and version : Chrome|Firefox|Safari x.x.x
• This package version : 2.4.3

Current behavior Linked Pickers does not have the .data('DateTimePicker') value (shown as undefined) if the element has :wrap="true"

Expected behavior Linked Pickers should work as in the example provided in the docs

Minimal reproduction of the problem with instructions Clean installation of the component. In the next fiddle pick start date first and then end date. Look console for errors https://jsfiddle.net/Archer3CL/nev02jcf/

[ankurk91]

@archer3cl You are trying to bind to wrong DOM element. When you set :wrap="true" the date picker is bind to its parent element so you need to add ref to input-group instead.

<div class="input-group" ref="startDate">

And then you can get the datepicker instance like this.

let $startDate = $(this.$refs.startDate);

You can see updated js fiddle. https://jsfiddle.net/nev02jcf/9/