jQuery does not work in widget backend

Question

I created a widget which should use jQuery for switching between two views and implement the jQuery UI date picker.

I was wondering why my jQuery code does not work as I noticed that the date picker isn't working either. The console neither throws errors nor warnings.

This is my code inside the widget class:

function form($instance) {
    wp_enqueue_script('jquery-datepicker', get_bloginfo('template_url').'/styles/jquery-ui-1.10.4.custom.min', array('jquery', 'jquery-ui-core'));
    wp_enqueue_style('jquery.ui.theme', get_bloginfo('template_url').'/styles/jquery-ui.css');
}

Is there any known issue? Or do I have to take something into account?

EDIT

And this is in a main backend script:

$(document).ready(function() {
    $('#widget-so_calendar_excerpt-range_from').each(function() {
        console.log(this);
        $(this).datepicker({dateFormat: 'dd.mm.yyyy'});
    });
});

Something quite strange is going on here. When I reload the admin panel, every time the console log changes. It looks like this (each line one page reload):

[Log] <input class=​"widefat hasDatepicker" id=​"widget-so_calendar_excerpt-range_from" name=​"widget-so_calendar_excerpt[range_from]​" type=​"text">​ (backend.js, line 28)
[Log] input#widget-so_calendar_excerpt-range_from.widefat (backend.js, line 28)
[Log] <input class=​"widefat hasDatepicker" id=​"widget-so_calendar_excerpt-range_from" name=​"widget-so_calendar_excerpt[range_from]​" type=​"text">​ (backend.js, line 28)
[Log] input#widget-so_calendar_excerpt-range_from.widefat (backend.js, line 28)
[Log] <input class=​"widefat hasDatepicker" id=​"widget-so_calendar_excerpt-range_from" name=​"widget-so_calendar_excerpt[range_from]​" type=​"text">​ (backend.js, line 28)
[Log] input#widget-so_calendar_excerpt-range_from.widefat (backend.js, line 28)

In the DOM, the new class hasDatepicker never get's added.

Answer 1

In many cases, in backend you may use:

jQuery('#something')

instead of

$('#something')

Answer 2

It looks like it can be a selector issue. Try making your selector more specific for the widget in the sidebars:

Something like :

$('#widgets-right #widget-so_calendar_excerpt-range_from')

could work.

But, if you create a second instance of the widget, it can break again, because of the multiple same ids.