Menu
I am using multiple ui themes in one page. I create a custom theme with a css scope, lets say #scope. I use a datepicker field in the scope lets say #scope input#datepicker. the datepicker field does not get css styles from the the ui theme. I guess this is because it is dynamically created outside of #scope, how can I alter this, and how can make it to get styles from scoped.
335
I solved this problem with adding a wrapper div in code.
$(document).ready(function(){
$("#ui-datepicker-div").wrap('<div class="ui-layout-center" />');
});
@bkilinc, you are correct. The datepicker calendar is appended to document.body, outside of your custom scope.
http://bugs.jqueryui.com/ticket/4591 http://bugs.jqueryui.com/ticket/4306
In a structure like the following, the calendar is outside of the scope of the container.
<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>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
