Question

我正在使用jquery datepicker进行primefaces日历，我刚刚创建了p：inputtext并在其上调用了jquery datepicker。当我将p：inputtext 放在p：tab 之外时，会调用此datepicker，但是当我将p：inputtext 放在p：tab 内时，不会显示此日期选择器。

JQuery函数：

<script>
    $(function() {

        $('.calenderType').calendarsPicker();
});
    </script>

1）输入可以使日历正常工作的文本：

<table>
   <tr>
    <td><p:inputText value="#{gen.appInitDate}" id="appInitDate"
                maxlength="100" onchange="changeEVENT();"
                disabled="#{gen.disableGen}"  class="calenderType">
        </p:inputText>
    </td>
    </tr>
</table>

2）输入没有压延的文字：

    <p:tab titleStyle="font-weight:bold" title="#{lang.gen_info}" id="genInfoTabId"
        titleStyleClass="collapsible" >
    <p:panel id="geninfop" >
    <table>
        <tr>
            <td>
            <p:inputText value="#{gen.appInitDate}" id="id1"
               maxlength="100" onchange="changeEVENT();" 
               disabled="#{gen.disableGen}" class="calenderType">
            </p:inputText>
            </td>
        </tr>
            </table>
        </p:panel>
        </p:tab>

</p:accordionPanel>

2）场景中p：inputtext位于p：tab中，因此由于jquery日历不起作用，任何jquery功能都无法调用它。请为此提出一些解决方案。

Answer 1

我已经通过如下更改jquery代码来做到这一点：

<script>
    $(function() {
        $('.calenderType').calendarsPicker();
        setInterval(function(){
            $('.calenderType').calendarsPicker();},100);
});
    </script>

每0.1秒调用一次该函数，它就会起作用。

单击Primefaces中p：tab中的p：inputText时未显示Jquery Datepicker

1 个答案: