Jquery datepicker from css scope

I use several ui themes on one page. I am creating a custom theme with a css scope, say #scope . I use the datepicker field in an area, say #scope input#datepicker . datepicker field does not get css styles from ui theme. I think this is because it is dynamically created outside of #scope , how can I change it, and how to get it to get styles from the scope.

+6
jquery css jquery-ui datepicker
source share
3 answers

I solved this problem by adding a div wrapper to the code.

 $(document).ready(function(){ $("#ui-datepicker-div").wrap('<div class="ui-layout-center" />'); }); 
+4
source share

@bkilinc, you're right. The datepicker calendar is added to document.body, outside of your custom area.

http://bugs.jqueryui.com/ticket/4591 http://bugs.jqueryui.com/ticket/4306

In a structure like the following, the calendar goes beyond the container's content area.

 <style type="text/css"> .calendarContainer .ui-datepicker { /* rule intended to affect only .calendarContainer */ } </style> ... <body> <div class="calendarContainer"><input name="date"/></div> <div class="ui-datepicker"> (generated calendar)</div> </body> 
+2
source share

I remember that I have the same problem, check the style defined in general, for example span , it may intersect with ui styles.

0
source share

All Articles