ghiscoding / Aurelia-Bootstrap-Plugins

Aurelia-Bootstrap-Plugins are Custom Elements to bridge with a set of 3rd party Bootstrap addons
https://ghiscoding.github.io/Aurelia-Bootstrap-Plugins
MIT License
45 stars 23 forks source link

AbpDatetimePickerCustomElement.showCalendar -Cannot read property 'data' of undefined #38

Closed ayaanraj closed 6 years ago

ayaanraj commented 6 years ago

I'm using Aurelia-skeleton-esnext and bootstrap v4. And I have configured the plugin as below: In main.js:

.plugin('aurelia-bootstrap-datetimepicker', config => {
      // extra attributes, with config.extra
      config.extra.iconBase = 'font-awesome';
      config.extra.withDateIcon = true;
      // or any picker options, with config.options
      config.options.showClear = true;

      // or any picker options, with config.options
      config.options.showTodayButton = true;

      // or any picker options, with config.options
      config.options.format = 'DD-MM-YYYY';

      // or any picker options, with config.options
      config.options.allowInputToggle = true;

      // if you use Bootstrap 4 Beta 3
      config.extra.bootstrapVersion = 4;

      // you can also change the Bootstrap 4 button class, default is shown below
      config.extra.buttonClass = 'btn btn-outline-secondary';
    })

So, when I click on Calender-Icon, it show the error: *AbpDatetimePickerCustomElement.showCalendar* -Cannot read property 'data' of undefined

ghiscoding commented 6 years ago

Please provide more info and ways to reproduce, also include your View code

ayaanraj commented 6 years ago

This is my view code :

<abp-datetime-picker value.bind="dob & validate "></abp-datetime-picker>

For the first time, their is no problem, I mean to say, when I navigate from home route to the page where dateTimePicker located. But the problem rises when I navigate to some other route, from the page where dateTimePicker located and come back to the dateTimePicker located page, then again, when I click on calendar icon, it throws error which i have mentioned. And also If I'm not using the calendar-icon, the other way to show calendar is, when input element gets the focus, while this also, it throws same error as mentioned. AbpDatetimePickerCustomElement.prototype.showCalendar = function showCalendar() { this.domElm.data('DateTimePicker').show(); }; the above function throws the error and when I check the value of this.domElm is undefined

ayaanraj commented 6 years ago

Hey, that error was due some binding issue in application, And their is no issue with this plugin, so closing this issue

ghiscoding commented 6 years ago

Awesome, thanks for letting me know, less troubleshooting time :)