Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

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.

share|improve this question
    
Did you register your script or styles before enqueueing it? –  Raja67 Jan 23 at 13:39
    
What does the developer tools console say in terms of errors? –  songdogtech Jan 23 at 13:44
    
@songdogtech I forgot to mention that, sorry. Theres nothing on the console. –  Julian Jan 23 at 13:46
    
@Raja67 no, I did not. Because I used the same code in a different theme and it's working perfectly. –  Julian Jan 23 at 13:47
    
Please re-read my question. I added some code and more informations –  Julian Jan 23 at 13:51

1 Answer 1

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.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.