Bootstrap-datetimepicker: end() is not a function when using find()

Question

http://eonasdan.github.io/bootstrap-datetimepicker/

I'm getting Uncaught TypeError when using find() to set dates to found elements.

Uncaught TypeError: $(...).find(...).data(...).end(...).find(...).data(...).date(...).end is not a function

$('.assignees-form .assignee:last')
    .find('.start input').data('DateTimePicker').date('04/17/2017 19:50 pm').end()
    .find('.due input').data('DateTimePicker').date('04/17/2017 20:15 pm').end()
    ......

Works just fine when not using end().

$('.assignees-form .assignee:last').find('.start input').data('DateTimePicker').date('04/17/2017 19:50 pm');
$('.assignees-form .assignee:last').find('.due input').data('DateTimePicker').date('04/17/2017 20:15 pm');

I have more than 25 elements to update and I don't want to start duplicating lines.

Any advise?

Answer 1

As Jacky Shek stated in the comments date() is a function of the datetimepicker and it does not return a jQuery object, so it is not chainable.

You can cache your jQuery selector and then use find instead of using end().

Your code could be like the following:

var $elem = $('.assignees-form .assignee:last');
$elem.find('.start input').data('DateTimePicker').date('04/17/2017 19:50 pm');
$elem.find('.due input').data('DateTimePicker').date('04/17/2017 20:15 pm');