Применить cssoped CSS к динамически созданному jquery ui datepicker

0

Я динамически создаю datepicker на странице asp.net при нажатии кнопки. Я использовал jquery ui themerollover и scode для datepicker, так что datepicker отличается от остальных элементов jquery ui:

мой jquery выглядит так:

 <script type="text/javascript">
        $(document).ready(function () {

            $("<input type='hidden'/>").appendTo($('body')).datepicker();
            $("#ui-datepicker-div").wrap('<div class="chenge-a" />');


            $(".chenge-a").datepicker({
                 numberOfMonths: 2,
                 showCurrentAtPos:1,         
                onSelect: function (value, date) {                   
                    $(".txt").val(value);
                    $(".txt").change(function () {
                    }).triggerHandler('change');
                    e.preventDefault();
                }
            });
        });


     </script>

мой html выглядит так:

<asp:TextBox ID="txtdatetemp" runat="server" AutoPostBack="True" 
    ontextchanged="txtdatetemp_TextChanged" class="txt" style="display:none" ></asp:TextBox>


  <span id="spDate">
                <asp:Button ID="Button2" runat="server"  Text="<%$ Resources:Vacancies, DateRange %>" CssClass="chenge-a" OnClientClick="return false;" />
                </span>

В выше jquery я добавил следующие строки, потому что это ошибка в jquery datepicker, что она не выбирает тему с областью:

   $("<input type='hidden'/>").appendTo($('body')).datepicker();
                $("#ui-datepicker-div").wrap('<div class="chenge-a" />');

Подробнее здесь:

Создание программно созданного jQuery UI datepicker для работы с областью CSS

но у него есть недостаток, потому что, когда загружается страница, датпикер отображается внизу страницы asp.net. Каков наилучший способ применения области jQuery ui theme to datepicker?

Я попытался скрыть дампикер, используя этот css

.ui-datepicker-inline{display:none !important}

но затем datepicker не отображается при нажатии кнопки

Теги:
datepicker

1 ответ

0

Я добавил этот класс:

.chenge-a.ui-datepicker-inline {display: none! important}

и это сработало.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню